@charset "UTF-8";
/* CSS Document */

.clearfix {zoom:1;}
.clearfix:after {content: "";  display: block; clear: both;}

a:link { color: #000;}
a:visited { color: #000; }
a:hover { color: #ff6b6b;}
a:active { color: #000; }


body{color:#353535; background-attachment:fixed;background: #fff; position: relative;}
#main{ min-width:1060px; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;}
body, html, main {
    /* important */
    height: 100%;
}
section{ position:relative;  overflow: hidden;}
p strong{color:#ff6b6b; font-weight:normal;}
section#vision:before {width: 50%; height: 100%;  content: ""; position: absolute; top: 0; left: 50%; background: #f1f4f6; z-index:0;}
section#vision:after{width: 50%; height: 100%;  content: ""; position: absolute; top: 0; right: 50%; background: #fff; z-index:0;}
section#company:before {width: 50%; height: 100%;  content: ""; position: absolute; top: 0; left: 50%; background: #fff; z-index:0;}
section#company:after{width: 50%; height: 100%;  content: ""; position: absolute; top: 0; right: 50%; background: #f1f4f6; z-index:0;}
section#sns:before {width: 50%; height: 100%;  content: ""; position: absolute; top: 0; left: 50%; background: #f1f4f6; z-index:0;}
section#sns:after{width: 50%; height: 100%;  content: ""; position: absolute; top: 0; right: 50%; background: #fff; z-index:0;}
section#vision .inner{ position:relative;  z-index:10;}
section#company .inner{ position:relative;  z-index:10; text-align:left;}
section#sns .inner{ position:relative;  z-index:10; padding-top:80px;}

footer{ background:#807f7f; z-index:100;}
footer p{ color:#fff; }
footer p.copy { text-align:center;}
footer p.policy a{ color:#fff;}
footer p.policy a:hover { color: #ff6b6b;}
section#contact .inner input,section#contact .inner textarea {border: 1px #C9C9C9 solid;}

@media (min-width:641px){
.sp{display:none;}
	
.menu-btn {display:none;}
.menu {display:none;}
	
.fixed {position: fixed; }


p{ font-size:14px; line-height:26px; letter-spacing: 1px; text-align:left;}

header{ min-width:1060px;  z-index:1000; position:relative;}
header .logo{ position:absolute; left:30px; top:30px;}
header nav{  z-index:1000; width:100%;}
header nav ul{ line-height:0;position:absolute; right:0; top:0;}
header nav ul li{ float:left; padding:20px 25px; border-left:1px #a9a9a9 solid;}


/* -- スクロール後のナビゲーションstyle -- */
header .nav.fixed {position:fixed; top:0; background:rgba(255,255,255,0.90); height:30px; width:100%; display:block; z-index:999;}
header .nav.fixed li {border-left:1px solid #000; padding:0 20px; margin:10px 0; letter-spacing:0.15em;}

/* -- /スクロール後のナビゲーションstyle -- */

#top {min-width:1060px; padding-bottom:0;}
#top .headerimg { background-position:center; background-size:cover; background-repeat:no-repeat; width:100%; height:100%; position:absolute; z-index:-100;}


#top #mv-txt01{ position:absolute; bottom:20%; right:0;}
#top #mv-txt02{ position:absolute; top:15%; right:0;}
#top #mv-txt03{ position:absolute; bottom:20%; right:0;}


section .inner{ width:1000px; margin:0 auto; padding:0 30px;}
section{ padding-bottom:80px; min-width:1060px;}
section h2{ padding:100px 0 80px; text-align:center;}
section h2 img{ width:483px;}

section .inner .right{ width:500px; float:right;}
section .inner .right p{ width:470px; margin-left:30px;}
section .inner .left{ width:500px; float:left;}
section .inner .left p{ width:470px; margin-right:30px;}
section p.img img{ width:100%;}



section#vision h3{padding-bottom:20px; margin-bottom:20px; border-bottom:5px solid #f1f4f6;}
section#vision p{ font-size:15px; line-height:33px;  width: 500px;}

section#business{ }
section#business .inner{ min-width:1000px; width:100%; max-width:1400px; padding:0;}
section#business ul{ text-align:center; margin:0 auto; padding:0 0 30px 0; }
section#business ul li { width:33.3%; float:left;}
section#business ul li:last-child{ width:33.4%;}
section#business ul li p{ margin-top:20px; text-align:center;}
section#business ul li p.st{position: relative; padding:10px 0 20px;}
section#business ul li p.st:after{position: absolute; content: ""; bottom: 0; left: 50%; margin-left: -96px; width: 192px; height: 1px; background:url(../images/border.gif) top left no-repeat; background-size: 192px 1px;}
section#business ul li img{ width:100%;}
section#business ul li .btn{ padding-top:20px;}
section#business ul li .btn img{width:70%;}
.scale{overflow: hidden;}
.scale img {transition: 0.3s;}
.scale img:hover {-webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1);}



section#company h2{padding-bottom:70px;}
section#company .message{padding-bottom:130px;}
section#company .message p{ font-size:15px; line-height:30px; padding-bottom:20px;}
section#company .message h3,section#company .information h3{padding-bottom:15px; margin-bottom:20px; border-bottom:5px solid #fff;}
section#company .message p.img{ position:absolute; top:250px; right:0;}
section#company .message p.img img{width:100%;}

section#company .profile{padding-bottom:100px;}
section#company .profile h3{padding-bottom:15px; padding-left:30px; margin-bottom:20px; border-bottom:5px solid #f1f4f6;}
section#company .profile h4{padding-bottom:8px; font-size:16px;}
section#company .profile p{ font-size:13px; line-height:22px; padding-bottom:20px;}
section#company .profile p.name{ font-size:20px; padding-bottom:20px;}

section#company .information dl{ font-size:13px; line-height:26px; position:relative; letter-spacing: 1px; width:470px; }
section#company .information dl dt{float:left; padding:14px 0 10px 0; text-align:left; width:100px; font-weight:bold;}
section#company .information dl dd{padding:14px 0; border-bottom:1px solid #b4b4b4; text-align:left;}
section#company .information dl dd a{color:#ff2f59;}

section#company .information .right dl{margin-left:30px;}
section#company .information .right dl dt{float:none; padding:14px 0 0 0;}
section#company .information .right dl dd{padding:5px 0 14px; }

section#contact .inner table.table-form{ font-size:15px; background:#fff; border:1px solid #656565; width:800px; margin-top:20px; margin:0 auto;}
section#contact .inner table.table-form th{ width:150px;  background:#dfe5e9; padding:22px; border-bottom:1px solid #656565; vertical-align:middle; text-align:left;}
section#contact .inner table.table-form td{ padding:22px; border-bottom:1px solid #656565; vertical-align:middle;}
section#contact input.name,section#contact input.email {  width:550px!important;}
section#contact textarea.message { resize: vertical; width:550px!important; min-height:100px!important;}

section#contact .inner .submit {
	padding-top:50px;
	text-align:center;
	}

section#contact .inner .submit input {
	background:url(../images/btn_contact.png) 0 0 no-repeat;
	border:none;
	margin: 0 auto;
	padding: 0 0 0 0;
	width:230px;
	height:61px;
	text-indent: -9999px;
	display:block;
	transition:0.5s;
	}
section#contact .inner .submit input:hover {opacity:0.5;}

section#map{ padding:0;}

section#sns ul li { padding-bottom:20px; padding-left:30px;}
section#sns ul li img{width: 100%;}
section#sns{padding-bottom:50px;}

footer{ padding:20px 0; min-width:1000px; }
footer .inner{ width:1000px; margin:0 auto; position:relative;}
footer p{font-size:10px;}
footer p.policy { position:absolute; right:0; top:50%; margin-top:-10px;}


#thanks{ text-align:center; min-width:1060px; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;}
#thanks section h2{ padding-top:200px; padding-bottom:40px;}
#thanks section p{padding-bottom:80px; text-align:center; font-size:16px;}
#thanks section .btn{padding-bottom:150px;}
#thanks footer{ position:fixed; bottom:0; width:100%;}


#policy{ text-align:center; min-width:1060px; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;}
#policy section h2{ padding-top:150px; padding-bottom:60px;}
#policy section h3{padding-bottom:30px; font-size:23px; text-align:left; color:#353535;}
#policy section h4{padding-bottom:10px; padding-top:20px; font-size:18px; text-align:left; color:#353535; font-weight:bold;}
#policy section p{padding-bottom:15px; text-align:left; font-size:14px;}
#policy section .txt01{padding-bottom:30px; margin-bottom:20px; border-bottom:1px solid #353535;}



/* Sweep To Right */
.hvr-sweep-to-right {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-sweep-to-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #ff9494;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: white;
}
.hvr-sweep-to-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}


/*フェードイン*/

.list-mv02{
	opacity: 0;
}
.mv02{
	opacity: 1.0;
}

	
	/*スクロール*/
	
	.cd-fixed-bg {
    min-height: 100%;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
}
  
	
	
}



@media screen and (max-width:640px){
body{width:100%;}	
#main{ background-size:80%;}
.inner{overflow: hidden;}
p{ font-size:3.4375vw; line-height:6.875vw; letter-spacing:2%; text-align:left;}

.pc{display:none;}

#main{ min-width:100%;}
section p{ padding-top:3.125vw; width:100%;}

header{min-width:100%; height:19.6875vw; border-bottom:4px #cfd7dc solid; background:#fff;}
header .inner{width:100%;}
header nav.nav{display:none;}
header .sns{ position:absolute; left:5%; top:10px;}
header .logo{ position:absolute; left:50%; margin-left:-15.78125vw; top:3.125vw; width:31.71875vw;}
header .logo img{ width:100%;}
header .sns li img{width:100%;}
header .sns li{ float:left; padding-right:10px;width:20%;}

#top {background:url(../images/sp_top_bg.jpg) top center no-repeat; background-size:100%; height:122.5vw; width:100%;}
.mv {display:none!important;}

section{width:100%; min-width:100%; padding-bottom:9.375vw;}
section#top{padding-bottom:0;}

section .inner{ width:90.625%; margin:0 auto;}
section h2{ padding:15% 0; width:100%; margin:0 auto;}
section h2 img{width:100%; }
section img{ width:100%;}

section#vision p,section#business p{ text-align:center;}
section#vision h3{padding-bottom:3.125vw; width:80%; margin:0 auto;}
section#vision h3 img{}
section#vision p{padding-bottom:3.125vw;}

section#business{padding-bottom:0;}
section#business ul li{padding-bottom:14.0625vw;}
section#business ul li p.st{position: relative; padding-bottom:3.125vw;}
section#business ul li p.st:after{position: absolute; content: ""; bottom: 0; left: 50%; margin-left: -96px; width: 192px; height: 1px; background:url(../images/border.gif) top left no-repeat; background-size: 192px 1px;}
section#business ul li .btn{width:62.5vw; margin:5.625vw auto 0;}

section#company h3 img{ width:100%; margin:0 auto;}
section#company .message,section#company .profile{ padding-bottom:14.0625vw;}
section#company .message p.img{ padding:6.25vw 0 3.125vw;}

section#company .information dl{ font-size:3.125vw; line-height:6.25vw; position:relative; letter-spacing:0; width:100%; }
section#company .information dl dt{float:left; padding:3.125vw 0 3.125vw 0; text-align:left; width:21vw; font-weight:bold;}
section#company .information dl dd{padding:3.125vw 0 3.125vw 0; border-bottom:1px solid #b4b4b4; text-align:left;}

section#company .profile p{ font-size:3.125vw; line-height:6.25vw;  }
section#company .profile p.name{ font-size:5vw;}
section#company .profile h4{font-size:4.375vw; padding-top: 4.375vw;}
section#company .profile h4 + p{padding-top: 2vw;}
section#company .information .right dl{ font-size:3.125vw; line-height:6.25vw; position:relative; letter-spacing:0; width:100%; }
section#company .information .right dl dt{float:none; padding:3.125vw 0 0 0; text-align:left; width:21vw; font-weight:bold;}
section#company .information .right dl dd{padding:0 0 3.125vw 0; border-bottom:1px solid #b4b4b4; text-align:left;}

section#contact .inner table.table-form{ font-size:3.125vw; background:#fff; border:1px solid #656565; width:100%; margin-top:0; margin:0 auto; width:100%; font-size:3.125vw; line-height:4vw;}
section#contact .inner table.table-form th{width:15.625vw; background:#dfe5e9; padding:2.8125vw; border-bottom:1px solid #656565; vertical-align:middle; text-align:left;}
section#contact .inner table.table-form td{ padding:2.8125vw; border-bottom:1px solid #656565; vertical-align:middle;}
section#contact .inner .submit {
	padding-top:6.25vw;
	padding-bottom:5.625vw;
	text-align:center;
	}

section#contact .inner .submit input {
	background:url(../images/btn_contact.png) 0 0 no-repeat;
	background-size:35.9375vw 9.53125vw;
	border:none;
	margin: 0 auto;
	padding: 0 0 0 0;
	width:35.9375vw;
	height:9.53125vw;
	text-indent: -9999px;
	display:block;
	transition:0.5s;
	}
	
section#contact input.name,section#contact input.email { width:61.5vw!important;}
section#contact textarea.message { resize: vertical; width:61.5vw!important; min-height:15.625vw!important;}
section#contact input,section#contact input,section#contact textarea{-webkit-appearance: none; border-radius: 0;}

section#map{ padding-bottom:0;}
section#sns ul{ padding-top:9.375vw;}
section#sns ul li { padding-bottom:3.125vw;}
section#sns .fb-page{width:100%;}
section#sns .inner{padding-top:9.375vw;}

footer{width:100%; min-width:100%; font-size:3.125vw; padding:6.25vw 0;}
footer .inner{ width:100%;}
footer .inner p.policy{ text-align:center;}


#thanks{ text-align:center; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;  background-size:80%;}
#thanks section h1{ padding-top:15.625vw; padding-bottom:40px;}
#thanks section p{font-size:3.75vw; text-align:center;}
#thanks section .btn{width:50%; margin:0 auto;}
#thanks section .btn{padding:6.25vw 0 15.625vw;}
#thanks footer{ position:fixed; bottom:0; width:100%;}


#thanks{ text-align:center; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;  background-size:80%;}
#thanks section h1{ padding-top:15.625vw; padding-bottom:6.25vw;}
#thanks section p{font-size:3.75vw; text-align:center;}
#thanks section .btn{width:50%; margin:0 auto;}
#thanks section .btn{padding:6.25vw 0 15.625vw;}
#thanks footer{ position:fixed; bottom:0; width:100%;}

#policy{ text-align:center; background:url(../images/bg-repeat.png) repeat #c5daec; background-attachment: fixed;  background-size:80%;}
#policy section h2{ padding-top:15.625vw; padding-bottom:15.625vw;}
#policy section h3{padding-bottom:3.125vw; font-size:5vw; text-align:left; color:#353535;}
#policy section h4{padding-bottom:1.5625vw; padding-top:4.6875vw; font-size:4.0625vw; text-align:left; color:#353535; font-weight:bold;}
#policy section p{padding-bottom:4.6875vw; text-align:left; font-size:3.75vw;}
#policy section .txt01{padding-bottom:4.6875vw; margin-bottom:4.6875vw; border-bottom:1px solid #353535;}

/* -- ハンバーガーメニューstyle -- */
.menu-btn {position: fixed; top:5vw; right:4.6875vw; width: 9.375vw;  height: 9.375vw; font-size: 0; cursor: pointer; z-index: 2000;}
.menu-btn span:after { content: attr(data-txt-menu); background:url(../images/icon_menu.png) no-repeat; background-size:9.375vw 9.375vw; width: 9.375vw;  height: 9.375vw; display:block; }
.open .menu-btn span:after {content: attr(data-txt-close); background:url(../images/icon_close.png) no-repeat; background-size:9.375vw 9.375vw; width: 9.375vw;  height: 9.375vw; z-index: 1000;}
.menu {position: fixed; display: table; top: 0; left: 0; width: 100%; height: 100%; background:rgba(197,218,236,0.95); -webkit-transition: all .5s; transition: all .5s; visibility: hidden; opacity: 0;}
.menu ul { display: table-cell; vertical-align: middle;}
.menu li:first-child{ border-top:1px solid #fff;}
.menu li { width:100%; height: 20vw; border-bottom:1px solid #fff; line-height: 20vw; margin: 0 auto; text-align: center;}
.menu li img {width:100%;}
.menu li a {display: block; font-size: 6.25vw; color: #fff; text-decoration:none;}
.open .menu { cursor: url(../images/cross.svg),auto; -webkit-transition: all .5s; transition: all .5s; visibility: visible; opacity: 1; z-index: 1000;}
/* -- /ハンバーガーメニューstyle -- */

}





/*animation*/

.fadeInUp01,.fadeInUp02,.fadeInUp03,.fadeInUp04,.fadeInUp05,.fadeInUp06{
    animation-fill-mode:both;
    animation-duration:1s;
    animation-name: fadeInUp;
    visibility: visible !important;}
 
/*animation-delayでタイミングをずらしている*/
.fadeInUp02{
    animation-delay: 0.3s;
}
.fadeInUp03{
    animation-delay: 0.7s;
}
.fadeInUp04{
    animation-delay: 1.1s;
}
.fadeInUp05{
    animation-delay: 1.5s;
}
.fadeInUp06{
    animation-delay: 1.9s;
}
 
/*@translateYで縦の動き・translateXで横の動きを指定できる*/
@keyframes fadeInUp {
    0% { opacity: 0; transform: translateY(20px);}
    100% { opacity: 1; transform: translateY(0);}
}


/*メインビジュアル*/

#mv .pc,#mv .alcoholic,#mv .btn_reserve {
    animation: fadeIn 1s ease 0s 1 normal;
    -webkit-animation: fadeIn 1s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}



/*ズームイン*/


.list li,.list div,.list dt,.list p,.list h2{
	transition: .8s;
}


.list-mv01{
	transform: scale(0, 0);
	-webkit-transform: scale(0, 0);
}
.mv01{
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
}


/*上移動*/

.list-mv05{
	transform: translate(0,80px); 
	-webkit-transform: translate(0,80px); 
}
.mv05{
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}