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


/* ---------- general ---------- */

html, body {
    height: 100%;
	}

img {
	max-width: 100%;
	height: auto;
	width /***/: auto;　
	border: 0 none;
	display: block;
	}

* {
	margin: 0px;
	padding: 0px;
	}

.clearboth {
	clear: both;
	}

a img {
	border: none;
	}

ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	}

.margin_r_zero {
	margin-right: 0 !important;
	}


/* ---------- base layout ---------- */

body {
	background-color: #FFF;
	background-image: url('../images/general/bg_pattern02.jpg');
	background-position: center top;
	background-repeat: repeat;
	font-family: 'Montserrat', Futura, sans-serif;
	font-style: normal;
	color: #007A48;
	font-size: 14px;
	line-height: 18px;
	text-decoration: none;
	position: relative;
	width: 100%;
	}


/* ---------- index ---------- */

body.index {
	background-color: #C8BD96;
	background-image: none;
	position: relative;
	}
#index_enter {
	background-color: #C9BE97;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -340px;
	margin-left: -129px;
	}
img.preload {
	width: 0px;
	height: 0px;
	display: none;
	}

.home_animation {
  background-color: #C8BD96;
  background-image: none;
  width: 100%;
  height: 100%;
  position: relative;
}
.home_animation img {
  display: block;
}
.index_scrolldown {
  background-color: transparent;
	background-image: url('../images/index/scrolldown.png');
	background-position: center top;
  width: 200px;
  height: 200px;
}
.index_animation_scroll {
  margin: 50px 0 0 116px;
  font-size: 30px;
}

/* ---------- general ---------- */

#container {
	background-color: transparent;
	background-image: url('../images/general/bg_shadow02.png');
	background-position: center top;
	background-repeat: repeat-y;
	width: 960px;
	margin: auto;
	padding: 0 10px;
	position: relative;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	}

.header {
	background: none;
	width: 100%;
	border-bottom: #999 solid thin;
	padding-bottom: 20px;
	}
.logo_main a {
	float: left;
	padding-left: 20px;
	padding-top: 20px;
	}
.logo_main img {
	max-width: 205px;
	}


.header .header_info {
	background: none;
	float: right;
	padding-right: 20px;
	padding-top: 52px;
	text-align: right;
	}
.header .header_info .header_address {
	color: #007A48;
	font-size: 14px;
	line-height: 18px;
	font-weight: 400;
	text-decoration: none;
	margin-bottom: 7px;
	}

.header .header_info .sns_btn {
	background: none;
	height: 50px;
	float: right;
	margin-bottom: 15px;
	}

.header .header_info .sns_btn ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	}
.header .header_info .sns_btn ul li {
	float: left;
	}

.header .header_info .sns_btn ul li a {
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 50px 110px;
	height: 50px;
	width: 50px;
	display: block;
	margin-right: 8px;
	}
.header .header_info .sns_btn ul .header_facebook_btn a {
	background-image: url('../images/general/header_facebook_btn.png');
	}
.header .header_info .sns_btn ul .header_instagram_btn a {
	background-image: url('../images/general/header_instagram_btn02.png');
	}
.header .header_info .sns_btn ul .header_twitter_btn a {
	background-image: url('../images/general/header_twitter_btn.png');
	}
.header .header_info .sns_btn ul .header_yelp_btn a {
	background-image: url('../images/general/header_yelp_btn.png');
	}
.header .header_info .sns_btn ul .header_tripadvisor_btn a {
	background-image: url('../images/general/header_tripadvisor_btn.png');
	}
.header .header_info .sns_btn ul .header_foursquare_btn a {
	background-image: url('../images/general/header_foursquare_btn.png');
	}
.header .header_info .sns_btn ul li a:hover {
	background-position: bottom center;
	}

.header_menu {
	background: none;
	height: 18px;
	float: right;
	}
.header_menu ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	}
.header_menu ul li {
	float: left;
	}
.header_menu ul li a {
	height: 18px;
	display: block;
	color: #007A48;
	font-weight: 700;
	font-size: 18px;
	line-height: 18px;
	margin-right: 15px;
	text-decoration: none;
	}
.header_menu ul li a:hover {
	color: #C9BE97;
	}
.header_menu ul li a.active {
	color: #C9BE97;
	}


.contents_wrapper {
	background: none;
	width: 100%;
	}

.content {
	padding: 30px 20px;
	}

.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 50px;
	margin-left: -10px;
	}

.copyright {
	text-align: right;
	color: #333;
	font-size: 12px;
	line-height: 12px;
	font-weight: 400;
	padding: 20px 30px;
	}


/* ---------- details ---------- */

.title_box01 {
	width: 200px;
	float: left;
	margin-right: 20px;
	}
.text_box01 {
	width: 280px;
	float: left;
	margin-right: 20px;
	}

.title01 {
	color: #007A48;
	font-size: 24px;
	line-height: 28px;
	font-weight: 400;
	margin-bottom: 15px;
	}
.title02 {
	color: #007A48;
	font-size: 21px;
	line-height: 25px;
	font-weight: 700;
	margin-bottom: 10px;
	}
.title_large {
  color: #007A48;
	font-size: 28px;
	line-height: 34px;
	font-weight: 700;
	margin-bottom: 30px;

}

.text_general {
	color: #333;
	font-size: 16px;
	line-height: 21px;
	font-weight: 400;
	text-decoration: none;
	margin-bottom: 15px;
	}
.text_general a {
	color: #007A48;
	text-decoration: none;
	}
.text_general a:hover {
	color: #C9BE97;
	}
.text_small {
	color: #333;
	font-size: 13px;
	line-height: 17px;
	font-weight: 400;
	text-decoration: none;
	margin-bottom: 15px;
	}
.text_small a {
	color: #007A48;
	text-decoration: none;
	}
.text_small a:hover {
	color: #C9BE97;
	}
.text_normal {
	color: #333;
	font-size: 16px;
	line-height: 21px;
	font-weight: 400;
	text-decoration: none;
	margin-bottom: 10px;
	}
.text_normal a {
	color: #007A48;
	text-decoration: none;
	}
.text_normal a:hover {
	color: #C9BE97;
	}
.text_normal_en {
	color: #333;
	font-size: 16px;
	line-height: 21px;
	font-weight: 400;
	font-style: italic;
	text-decoration: none;
	margin-bottom: 10px;
	}
.text_normal_en a {
	color: #007A48;
	text-decoration: none;
	}
.text_normal_en a:hover {
	color: #C9BE97;
	}
.color_blk {
  color: #000;
}


/* ---------- home ---------- */
.home_concept {
	width: 450px;
	float: left;
	margin-right: 20px;
	margin-bottom: 40px;
	}
.home_slider_s {
	width: 450px;
	float: right;
	}

.cafe_menu_box {
	margin-bottom: 50px;
	}
.cafe_menu {
	width: 100%;
	border-top: thin dotted #007A48;
	padding-top: 10px;
	margin-bottom: 10px;
	}
.cafe_menu_info {
	width: 600px;
	float: left;
	}
.cafe_menu_pic {
	width: 300px;
	float: right;
	}

/* ---------- home sbnk banner ---------- */
.sbnk_color {
  color: #1B4379;
}
.sbnk_banner_home {
  width: 100%;
  border: #1B4379 solid thin;
  overflow: auto;
}
.sbnk_logo img {
  width: 240px;
}
.sbnk_logo {
  float: left;
  margin: 20px;
}
.sbnk_banner_text {
  float: left;
  margin: 20px 0 0;
}
.sbnk_artistania_logo {
  float: right;
  display: block;
  margin: 20px;
}
.sbnk_artistania_logo img {
  width: 140px;
  margin-top: 80px;
}
a.sbnk_banner_btn {
  background-color: #1B4379;
  padding: 5px 10px;
  display: block;
  color: #fff;
  text-decoration: none;
  width: max-content;
}
a:hover.sbnk_banner_btn {
  background-color: #0099B0;
}


.content_float_l {
  width: 45%;
  float: left;
  margin-right: 20px;
  margin-bottom: 40px;
}
.content_float_r {
  width: 50%;
  float: right;
  margin-bottom: 40px;
}


/* ---------- gallery ---------- */
.video_container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	margin-bottom: 40px;
	}
.video_container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}
.gallery01 {
	width: 100%;
	margin-bottom: 40px;
	}
.gallery01 ul li {
	float: left;
	}

.gallery01 ul li a {
	height: 120px;
	width: 120px;
	display: block;
	margin-right: 10px;
	margin-bottom: 10px;
	}

/* ---------- location ---------- */
.map {
	padding: 20px 0 15px;
	}





@media screen and (min-width: 1000px)  {
	}

@media screen and (max-width: 999px)  {
body {
	background-color: #00613B;
	background-image: none !important;
	}
#container {
	background-color: #FFF;
	background-image: none !important;
	width: 100% !important;
	padding: 0 !important;
	}
.title_box01 {
	float: none !important;
	}
.home_concept {
	width: 40% !important;
	}
.home_slider_s {
	width: 55% !important;
	}
.cafe_menu_info {
	width: 55% !important;
	}
.cafe_menu_pic {
	width: 40% !important;
	}

}

@media screen and (max-width: 920px)  {
  .sbnk_artistania_logo {
    display: none;
  }
}

@media screen and (max-width: 750px)  {
  .sbnk_logo {
    width: 30%;
    margin: 10px;
  }
  .sbnk_banner_text {
    width: 60%;
    margin: 10px;
  }


}



@media screen and (max-width: 699px)  {
#index_enter {
	margin-top: -220px;
	margin-left: -89px;
	}
#index_enter img {
	width: 178px;
	height: 350px;
	}

.logo_main {
	text-align: center !important;
	}
.logo_main a {
	float: none !important;
	padding-left: 0 !important;
	display: inline-block;
	}
.header .header_info {
	float: none !important;
	padding-right: 0 !important;
	padding-top: 20px;
	text-align: center !important;
	}
.header .header_info .sns_btn {
	float: none !important;
	display: inline-block;
	}
.header .header_info .header_menu {
	float: none !important;
	display: inline-block;
	}
.copyright {
	text-align: center !important;
	}
/* ----------
.content {
	text-align: center !important;
	}
---------- */
.title_box01 {
	text-align: center !important;
	margin-right: auto !important;
	margin-left: auto;
	}
.text_box01 {
	text-align: center !important;
	float: none !important;
	margin-right: auto !important;
	margin-left: auto;
	}
.home_concept {
	width: 100% !important;
	float: none !important;
	}
.home_slider_s {
	width: 100% !important;
	float: none !important;
	margin-right: auto !important;
	margin-left: auto !important;
	}
.cafe_menu_info {
	width: 100% !important;
	float: none !important;
	}
.cafe_menu_pic {
	float: none !important;
	margin-right: auto !important;
	margin-left: auto !important;
	width: 300px !important;
	}
  .content_float_l {
    width: 100%;
  	float: none;
  }
  .content_float_r {
    width: 100%;
  	float: none;
  }
  .index_animation_scroll {
    margin: 30px 0 0 80px; 
    font-size: 24px;
  }

}


@media screen and (max-width: 500px)  {
  .sbnk_banner_home {
    text-align: center;
  }
  .sbnk_logo {
    float: none;
  }
  .sbnk_logo img {
    margin: auto;
  }
  .sbnk_banner_text {
    float: none;
    width: auto;
  }
a.sbnk_banner_btn {
  margin: auto;
  margin-bottom: 30px;
}
}


@media screen and (max-width: 420px)  {
.header .header_info .header_menu {
	display: block;
	padding: 0 10px;
	height: auto;
	}
.header_menu ul li {
	float: none !important;
	}
.header_menu ul li a {
	margin-bottom: 7px;
	margin-right: 0 !important;
	}
.home_slider_s {
	width: 300px !important;
	}
.cafe_menu_pic {
	width: 250px !important;
	}

}