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

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
body {
	*font-size: small;
	*font: x-small;
	background-repeat: repeat;
	font-family: arial, helvetica, clean, sans-serif;
	font-size: 13px;
	line-height: 1.231;
}

select,
input,
button,
textarea,
button {
	font: 99% arial, helvetica, clean, sans-serif;
}

table {
	font-size: inherit;
	font: 100%;
}

pre,
code,
kbd,
samp,
tt {
	font-family: monospace;
	*font-size: 108%;
	line-height: 100%;
}

/*If you want this size in pixels (px)	Declare this percent (%)
10	 77
11	 85
12	 93 (was 93)
13	 100
14	 108 (was 107)
15	 116 (was 114)
16	 123.1 (was 122)
17	 131 (was 129)
18	 138.5 (was 136)
19	 146.5 (was 144)
20	 153.9 (was 152)
21	 161.6 (was 159)
22	 167
23	 174
24	 182
25	 189
26	 197
*/

html {
	width: 100%;
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	font-size: 13px;
	line-height: 1.5em;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align: center;
	margin: 0px;
	padding: 0px;
	-webkit-text-size-adjust: 100%;
	min-width: 320px;
	color: #404041;
	background-color: #004892;
}

html.over,
body.over {
	overflow: hidden;
}

#harmonyTop {
	background-color: #fff;
}

h1,
h2,
h3,
h4,
h5,
p,
ul,
li,
a,
img,
table,
th,
td,
dl,
dt,
dd {
	margin: 0px;
	padding: 0px;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5 {
	font-size: 13px;
	line-height: 1.2em;
}

li {
	list-style-type: none;
}

table {
	border-collapse: collapse;
}

img {
	vertical-align: top;
	-webkit-backface-visibility: hidden;
}


#loader .inner p img.logo_medal {
	max-width:550px;
	width:100%;
	height:auto;
}

a:focus,
*:focus {
	outline: none;
}

#wrap {
	width: 100%;
	position: relative;
}

.mt5 {
  margin-top: 5px;
}

/* ------------ loader ------------ */
#loader {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 1000;
	background-color: #fff;
	width: 100%;
	height: 100%;
}

#loader .inner {
	position: absolute;
	top: 50%;
	width: 100%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

#loader .ttl {
	margin-bottom: 40px;
}

#loader .ttl,
#loader .icon {
	opacity: 0;
}

#loader .ttl img {
	width: 200px;
	height: auto;
}

#loader .icon img {
	width: 50px;
	height: auto;
}

#loader .inner p {
	opacity: 0;
	display: none;
	padding: 0 60px;
}

#loader .inner p img {
	max-width: 1000px;
	width: 100%;
	height: auto;
}

@media screen and (max-width: 750px) {
	#loader .ttl img {
		width: 160px;
	}

	#loader .icon img {
		width: 30px;
	}

	#loader .inner p {
		padding: 0 15px;
	}

	.pc_only {
		display: none;
	}
}

/* ------------ header ------------ */
#header {
	position: fixed;
	top: 110px;
	left: 0;
	z-index: 99;
	width: 100%;
	padding: 30px 0;
	-webkit-transition: background 0.6s;
	-moz-transition: background 0.6s;
	-ms-transition: background 0.6s;
	-o-transition: background 0.6s;
	transition: background 0.6s;
}

/*body[aria-header-scroll="false"] #header {
	top: 0;
}*/

body.header-fixed #header {
  position: fixed;
  top: 0;
  left: 0;
}

#header.bg {
	background-color: #004896;
}

#header h1 {
	float: left;
	margin-left: 30px;
}

#header h1 {
	width: 192px;
}

#header h1 a {
	cursor: auto;
}

#header h1 img {
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 0;
	width: 100%;
	height: auto;
}

#header.bg h1 a {
	cursor: pointer;
}

#header.bg h1 img {
	opacity: 1;
}

#header.bg h1 img:hover {
	opacity: 0.6;
}

#header #h_navi.pc {
	display: block !important;
}

#header ul {
	float: right;
	font-size: 0;
	margin-right: 30px;
}

#header ul li {
	display: inline-block;
	vertical-align: top;
	margin-left: 40px;
}

#header ul li:first-child {
	margin-left: 0;
}

#header ul li a {
	display: block;
	font-size: 12px;
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	-webkit-transition: border 0.4s;
	-moz-transition: border 0.4s;
	-ms-transition: border 0.4s;
	-o-transition: border 0.4s;
	transition: border 0.4s;
	padding: 0 4px;
}

#header ul li:last-child a:after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 5px;
	background: url(../img/icon_external_link_pc.png) no-repeat center center;
	vertical-align: 1px;
}

#header ul li.active a,
#header ul li a:hover {
	border-bottom: 1px solid #fff;
}

#header ul li a img {
	height: 13px;
	width: auto;
	opacity: 1 !important;
}

#menu_btn {
	display: none;
}

#h_bnr {
	float: right;
}

@media screen and (max-width: 1000px) {
	#header ul li {
		margin-left: 13px;
	}

	#header ul li a img {
		height: 11px;
	}
}

@media screen and (max-width: 750px) {
	#wrap {}

	#header {
		top: 73px;
		padding: 15px 0;
		text-align: left;
	}

	#header h1 {
		float: none;
		margin-left: 20px;
	}

	#header #h_navi {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 101;
		width: 100%;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.6);
		float: none;
		margin-right: 0;
	}

	#header #h_navi {
		display: none;
	}

	#header #h_navi ul {
		position: absolute;
		top: 50%;
		left: 30%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-20%, -50%);
	}

	#header ul li {
		display: block;
		margin-left: 0;
		padding: 10px 20px;
		text-align: center;
	}

	#header ul li.active a,
	#header ul li a:hover {
		border-bottom: none;
	}

	#header ul li a {
		border-bottom: 1px solid transparent !important;
	}

	#header ul li:last-child a:after {
		content: "";
		width: 13px;
		height: 13px;
		margin-left: 10px;
		background: url(../img/icon_external_link_sp.png) no-repeat center center;
		background-size: contain;
	}

	#header ul li a img {
		height: 16px;
	}

	#menu_btn {
		display: block;
		position: absolute;
		right: 15px;
		top: 10px;
		z-index: 102;
		height: 26px;
		width: 26px;
		cursor: pointer;
		background-image: url(/brand/beer/img/menu_btn.png);
		background-position: bottom left;
		background-size: 26px 52px;
	}

	#menu_btn.active {
		background-position: top left;
	}
}

/* ------------ main ------------ */
#main01 {
	background-image: url(/brand/beer/img/main_kirishima_bottle.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	position: relative;
	width: 100%;
	height: 150vh;
}

#top_main_img02.tb {
	background-image: url(/brand/beer/img/main_kirishima_bottle.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-size: cover;
	position: relative;
	width: 100%;
}

#main01 h2 {
	background-image: url(/brand/beer/img/intro_copy_01.png);
	background-position: center 27%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	text-indent: -999999px;
	z-index: 1;
}

body.header-fixed #main01 h2 {
	background-position: center 20%;
}

#main02 {
	background-image: url(/brand/beer/img/main_kirishima_glass.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	position: relative;
	width: 100%;
	height: 100vh;
}

#main02 h2 {
	background-image: url(/brand/beer/img/intro_copy_02.png);
	background-position: center 20%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	position: relative;
	width: 100%;
	height: 100vh;
	opacity: 0;
	text-indent: -999999px;
}

#logo {
	background-image: url(/brand/beer/img/logo_kirishima.png);
	width: 120px;
	height: 110px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

#main_logo {
	position: fixed;
	left: 50%;
	margin-left: -630px;
	top: 100px;
	width: 200px;
	z-index: 1;
}

#main_logo img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 1300px) {
	#main_logo {
		left: 10%;
		top: 22%;
		width: 14%;
		margin-left: 0;
		margin-top: -7%;
	}

	#top_main_img02 h2 {
		background-size: 60% auto;
		background-position: 65% 20%;
	}
}

@media screen and (max-width: 1000px) {
	#main01 h2 {
		background-size: 90% auto;
	}

	#main02 h2 {
		background-size: 80% auto;
	}
}

@media screen and (max-width: 750px) {
	#main_logo {
		left: 50%;
		top: 12%;
		width: 100px;
		margin-left: -50px;
		margin-top: 0;
	}

	#main01 {
		background-image: inherit;
		background-color: #E7CEB5;
	}

	#top_main_img02 {
		height: 100%;
		background-image: url(/brand/beer/img/main_kirishima_bottle_sp.jpg);
		background-size: cover;
		background-position: center bottom;
		background-attachment: scroll;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
	}

	#main01 h2 {
		height: 100%;
		background-position: center 33%;
		background-attachment: scroll;
		background-size: 80% auto;
	}

	#main02 {
		background-image: inherit;
	}

	#top_main_img03 {
		height: 100%;
		background-image: url(/brand/beer/img/main_kirishima_glass_sp.png);
		background-size: cover;
		background-position: center bottom;
		background-attachment: scroll;
	}

	#top_main_img03 h2 {
		height: 100%;
		background-image: url(/brand/beer/img/intro_copy_02_sp.png);
		background-position: center 28%;
		background-attachment: scroll;
	}
}

/* ------------ about ------------ */
.about .section {
	position: relative;
	z-index: 2;
	width: 100%;
	min-height: 100vh;
	background-color: #fff;
}

#about .section {
	padding-top: 10%;
}

#about03 .section {
	padding-bottom: 5%;
}

.about .txt_area {
	position: relative;
}

.about .txt_area .txt {
	margin-top: 0 !important;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	text-align: center;
	width: 100%;
}

.about .txt_area .txt img {
	width: 100%;
	height: auto;
}

#about .txt_area .txt img {
	max-width: 452px;
}

#about02 .txt_area .txt img {
	max-width: 490px;
}

#about03 .txt_area .txt img {
	max-width: 450px;
}

#about_bg01 {
	position: fixed;
	left: 0;
	width: 100%;
	z-index: 1;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
	opacity: 0;
	bottom: -100%;
}

#about_bg01.active {
	bottom: 0;
	opacity: 1;
}

#about_bg01.end {
	position: absolute;
}

#about_bg01 img {
	width: 100%;
	height: auto;
}

#about04 {
	background-image: url(/brand/beer/img/about_sec_bg.jpg);
	background-position: center 20%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	z-index: 1;
}

#about_bg02 {
	width: 100%;
}

#about_bg02 img {
	width: 100%;
	height: auto;
}

#about04 .txt {
	position: relative;
	min-height: 100vh;
	display: block;
}

#about04 .txt p {
	position: fixed;
	top: 50%;
	left: 0;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	z-index: 1;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 0;
	width: 100%;
	text-align: center;
}

#about04 .txt p.active {
	opacity: 1;
}

#about04 .txt p img {
	max-width: 642px;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

#about .txt_area {
	margin: 0 auto;
}

#about .txt_area {
	margin: 0 auto;
}

#about .txt_area .inner {
	max-width: 500px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

#about .txt_area h2 {
	margin-bottom: 60px;
}

#about .txt_area h2 img {
	max-width: 490px;
	width: 100%;
	height: auto;
}

#about .txt_area p {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 16px;
	line-height: 2;
	margin-bottom: 30px;
	text-align: center;
	word-wrap: normal;
}

#about .txt_area p:last-child {
	margin-bottom: 0;
}

#water_bg {
	display: none;
}

@media screen and (max-width: 750px) {
	#about .txt_area .inner {
		top: 0;
		left: 0;
		position: relative;
		-webkit-transform: translate(0px, 0px);
		transform: translate(0px, 0px);
	}

	#about .section {
		min-height: 0;
		padding-top: 80px;
		padding-bottom: 160px;
	}

	#about .txt_area {
		height: auto !important;
	}

	.about .txt_area .txt {
		position: relative;
		height: auto !important;
	}

	.about .txt_area .txt img {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		padding: 0 20px;
	}

	#about03 .section {
		min-height: 0;
		padding-bottom: 80px;
	}

	.about .txt_area {
		height: auto !important;
	}

	.about .txt_area .txt {
		position: relative;
		transform: translate(0px, 0px);
	}

	#about04 {
		background-image: none;
		background-color: transparent;
	}

	#about04 .txt p {
		margin-top: 0 !important;
		position: absolute;
		top: 80%;
	}

	#about04 .txt p img {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		padding: 0 30px;
	}

	#about .txt_area {
		margin: 0 30px 0 20px;
	}

	#about .txt_area h2 {
		margin-bottom: 14%;
	}

	#about .txt_area p {
		font-size: 12px;
		line-height: 1.5;
		margin-bottom: 10%;
	}

	#water_bg {
		display: block;
		position: fixed;
		bottom: 0;
		left: 0;
		height: 100vh;
		width: 100%;
		background-image: url(/brand/beer/img/about_sec_bg.jpg);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		padding-bottom: 81px;
		opacity: 0;
	}

	#water_bg.active {
		opacity: 1;
	}
}

/* ------------ lineup ------------ */
#lineup {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 130vh;
	background-color: #fff;
	background-image: url(/brand/beer/img/about_sec_bg.jpg);
	background-position: center 20%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}

#lineup .section {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	background-color: #fff;
	opacity: 0;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#lineup.active .section {
	opacity: 1;
}

/* fast */
#lineup #fast {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	font-size: 0;
	opacity: 1;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-ms-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
	width: 200%;
}

#lineup #fast.active {
	opacity: 0;
}

#lineup #fast h2 {
	margin-bottom: 80px;
}

#lineup #fast h2 img {
	width: 180px;
	height: auto;
}

#lineup #fast ul {
	text-align: center;
}

#lineup #fast ul li {
	display: inline-block;
	width: 290px;
	margin: 0 -80px;
	-webkit-transition: margin 1s;
	-moz-transition: margin 1s;
	-ms-transition: margin 1s;
	-o-transition: margin 1s;
	transition: margin 1s;
}

#lineup #fast.active ul li {
	margin: 0;
}

#lineup #fast ul li img {
	width: 100%;
	height: auto;
}

#lineup #modal_box .txt .mt20 {
	margin-top: 20px;
}

#lineup #modal_box .txt .mt10 {
	margin-top: 10px;
}

/* second */
#second {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	font-size: 0;
	opacity: 1;
	-webkit-transition: opacity 1s, margin-left 1s;
	-moz-transition: opacity 1s, margin-left 1s;
	-ms-transition: opacity 1s, margin-left 1s;
	-o-transition: opacity 1s, margin-left 1s;
	transition: opacity 1s, margin-left 1s;
	opacity: 0;
	margin-left: 15%;
}

#second.min {
	width: 75%;
}

#second.end {
	opacity: 0 !important;
}

#second.active {
	opacity: 1;
	margin-left: 0;
}

#second.hide {
	opacity: 1;
	-webkit-transition: opacity 0.5s, margin-left 0.5s;
	-moz-transition: opacity 0.5s, margin-left 0.5s;
	-ms-transition: opacity 0.5s, margin-left 0.5s;
	-o-transition: opacity 0.5s, margin-left 0.5s;
	transition: opacity 0.5s, margin-left 0.5s;
	opacity: 0;
}

#second ul li {
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 0.4;
}

#second ul.bottle_list li img {
	width: 100%;
	height: auto;
}

#second ul.logo_list li .awards {
	max-width: 454px;
	margin: 0 auto;
}

#second.min ul.logo_list li .awards {
	max-width: 300px;
}

#second ul.logo_list li .awards img {
	width: 100%;
	height: auto;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#second ul.logo_list li .awards a:hover img {
	opacity: 0.6;
}

#second ul.logo_list li h3 {
	margin: 15px 0 10px 0;
}

#second ul.logo_list li h3 img {
	margin: 0 auto;
	max-width: 300px;
	width: 100%;
	height: auto;
}

#second.min ul.logo_list li h3 img {
	max-width: 250px;
}

#second ul.logo_list li .btn {
	font-size: 16px;
	color: #fff;
	font-weight: bold;
	width: 148px;
	padding: 8px 0;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	margin: 0 auto;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 1;
	cursor: pointer;
}

#btn01 {
	background-color: #F5821F;
}

#btn02 {
	background-color: #407611;
}

#btn03 {
	background-color: #730000;
}

#btn04 {
	background-color: #2C1500;
}

#btn05 {
	background-color: #8DC21F;
}

#btn06 {
	background-color: #eb5c01;
}

#btn07 {
	background-color: #d7073d;
}

#btn08 {
	background-color: #07bfc6;
}

#btn09 {
	background-color: #DF3657;
}

#btn10 {
	background-color: #37bef0;
}

#btn11 {
	background-color: #eb9d15;
}

#btn12 {
	background-color: #008c4a;
}

#btn13 {
	background-color: #7e351f;
}


#btn14 {
	background-color: #fdd000;
}

#btn15 {
	background-color: #c27f18;
}

#second ul.logo_list li {
	background-color: #fff;
}

#second ul.logo_list li .btn:hover {
	opacity: 0.6;
}

#second ul.bottle_list li.slick-current {
	opacity: 1;
}

#second ul li .btn {
	font-size: 13px;
}

#second ul.logo_list li a.btn {
	display: block;
	background-color: #eb5c01;
	text-decoration: none;
}


/* third */
#third {
	position: absolute;
	top: 49%;
	left: 50%;
	-webkit-transform: translate(-49%, -50%);
	transform: translate(-49%, -50%);
	width: 100%;
	font-size: 0;
	opacity: 1;
	-webkit-transition: opacity 1s, margin-left 1s;
	-moz-transition: opacity 1s, margin-left 1s;
	-ms-transition: opacity 1s, margin-left 1s;
	-o-transition: opacity 1s, margin-left 1s;
	transition: opacity 1s, margin-left 1s;
	opacity: 0;
	margin-left: 15%;
}

#third.min {
	width: 75%;
}

#third.end {
	opacity: 0 !important;
}

#third.active {
	opacity: 1;
	margin-left: 0;
}

#third ul li {
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 0.4;
}

#third ul.funfan_brew_bottle_list li img {
	width: 100%;
	height: auto;
}

#third ul.funfan_brew_bottle_list li img.sp_only {
  display: none;
}

#third ul.funfan_brew_bottle_list li img.first_view {
  margin-top: 30px;
}

#third ul.funfan_brew_logo_list li .awards {
	max-width: 454px;
	margin: 0 auto;
}

#third.min ul.funfan_brew_logo_list li .awards {
	max-width: 300px;
}

#third.min ul.funfan_brew_logo_list li .awards .sp_only {
  display: none;
}


#third ul.funfan_brew_logo_list li .awards img {
	width: 100%;
	height: auto;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#third ul.funfan_brew_logo_list li .awards a:hover img {
	opacity: 0.6;
}

#third ul.funfan_brew_logo_list li h3 {
	margin: 15px 0 10px 0;
}

#third ul.funfan_brew_logo_list li h3 img {
	margin: 0 auto;
	max-width: 300px;
	width: 100%;
	height: auto;
}

#third.min ul.funfan_brew_logo_list li h3 img {
	max-width: 250px;
}

#third ul.funfan_brew_logo_list li .btn {
	font-size: 16px;
	color: #fff;
	font-weight: bold;
	width: 148px;
	padding: 8px 0;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	margin: 0 auto;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 1;
	cursor: pointer;
}

#third ul.funfan_brew_logo_list li {
/* 	background-color: #fff; */
}

#third ul.funfan_brew_logo_list li .btn:hover {
	opacity: 0.6;
}

#third ul.funfan_brew_bottle_list li.slick-current {
	opacity: 1;
}

#third ul li .btn {
	font-size: 13px;
}

#third ul.funfan_brew_logo_list li a.btn {
	display: block;
	background-color: #eb5c01;
	text-decoration: none;
}

#third ul.funfan_brew_logo_list li a.btn.tea {
	display: block;
	background-color: #d7073d;
	text-decoration: none;
}






#lineup_null {
	position: relative;
	width: 100%;
	height: 200vh;
}

#lineup_null2 {
	position: relative;
	width: 100%;
	height: 100vh;
}

#lineup_null .section {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	background-color: #fff;
	opacity: 0;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#lineup_null.active .section {
	opacity: 1;
}

@media screen and (max-width: 750px) {
	#lineup {
		background-image: none;
		background-color: transparent;
	}

	#lineup #fast ul li {
		width: 20%;
		margin: 0 -6%;
	}

	#second ul.logo_list li .awards {
		max-width: 344px;
		padding: 0 10px;
	}

	#second ul.logo_list li h3 {
		margin: 8px 0 8px 0;
	}

	#second ul.logo_list li h3 img {
		max-width: 190px;
	}

	#second ul.logo_list li .btn {
		font-size: 13px;
		width: 120px;
		padding: 6px 0;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

  #third ul.funfan_brew_bottle_list {
  	max-height: 45vh;
  }

  #third ul.funfan_brew_bottle_list li img {
  	width: 70vw;
  }

	#third ul.funfan_brew_logo_list li .awards {
		max-width: 344px;
		padding: 0 10px;
	}

/*
	#third ul.funfan_brew_logo_list li .pc_only {
    display: none;
	}
*/

	#third ul.funfan_brew_logo_list li h3 {
		margin: 8px 0 8px 0;
	}

	#third ul.funfan_brew_logo_list li h3 img {
		max-width: 190px;
	}

  #third ul.funfan_brew_bottle_list li img.pc_only {
    display: none;
  }

  #third ul.funfan_brew_bottle_list li img.sp_only {
    display: inline;
  }

	#third ul.funfan_brew_logo_list li .btn {
		font-size: 13px;
		width: 120px;
		padding: 6px 0;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

	#lineup_null2 {
		height: 50vh;
	}
}


/* ------------ modal ------------ */
#modal_box {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	display: none;
	z-index: 2;
}

.modal {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	background-color: #fff;
	display: none;
	z-index: 2;
}

.modal .inner {
	position: relative;
	margin: 0 60px;
	height: 100vh;
}

.min .modal .inner {
	margin: 0 auto;
	max-width: 700px;
}

.brew-text {
	position: relative;
}


@media screen and (max-width: 820px) {
	.min .modal .inner {
		margin: 0 60px;
	}

	.modal.txt_active .brew-text .brew-table td:nth-child(2) {
		width: 47%;
	}

	.modal.txt_active .brew-text .brew-table td:last-child {
		width: 22%;
	}
}

.modal .detail {
	max-width: 1060px;
	width: 100%;
	font-size: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.modal .img {
	display: inline-block;
	vertical-align: middle;
	width: 46.225%;
}

.modal .img_box {
	position: relative;
}

.modal .img_box img {
	width: 100%;
	height: auto;
}

.modal .img_box img.bottle {
	position: relative;
	z-index: 1;
}

.modal .img_box img.glass {
	position: absolute;
	left: 0;
	top: 0;
	margin-left: 15%;
	-webkit-transition: margin 0.8s;
	-moz-transition: margin 0.8s;
	-ms-transition: margin 0.8s;
	-o-transition: margin 0.8s;
	transition: margin 0.8s;
}

.modal.active .img_box img.glass {
	margin-left: 0;
}

.modal .img .logo {
	text-align: left;
	margin: 20px 0 0 20px;
}

.modal .img .logo img {
	width: 62.5%;
	height: auto;
}

.modal .img .logo img.funfan_logo {
	width: 100%;
	height: auto;
}

.modal .txt {
	display: inline-block;
	vertical-align: middle;
	width: 53.775%;
	-webkit-transition: opacity 0.8s;
	-moz-transition: opacity 0.8s;
	-ms-transition: opacity 0.8s;
	-o-transition: opacity 0.8s;
	transition: opacity 0.8s;
	opacity: 0;
}

.modal.txt_active .txt {
	opacity: 1;
}

.modal.txt_active .brew-text p#funfan_info {
	font-size: 14px !important;
}

.modal.txt_active .brew-text p {
	font-size: 14px;
	text-align: left;
	margin-bottom: 1rem;
	line-height: 1.4;
}

.modal.txt_active .text-box {
	margin-right: 30px;
	margin-left: 60px;
}

.modal.txt_active .text-box p.beer_name {
	font-size: 16px;
	font-weight: bold;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}


.modal.txt_active .brew-text .list,
.list-text {
	font-size: 14px;
	text-align: left;
}

.modal.txt_active .brew-text .list-text li:first-of-type {
	margin-top: 12px;
}

.modal.txt_active .brew-text .list-text li {
	margin-top: 5px;
}

.modal.txt_active .brew-text .text-indent {
	padding-left: 1em;
	text-indent: -0.8rem;
}

.brew-table {
	font-size: 14px;
	margin-top: 20px;
	text-align: left;
}

.brew-table td {
	padding-bottom: 10px;
	vertical-align: bottom;
}

.brew-table td:first-child {
	vertical-align: top;
	width: 15%;
}

.brew-table td:nth-child(2) {
	width: 60%;
}

.brew-table td:last-child {
	width: 19%;
}

.brew-table td a {
	text-decoration: none;
}

.modal.txt_active .text-box {
	margin-right: 20px;
	margin-left: 38px;
}

.modal.txt_active .brew-text .arrow_content .image {
	width: auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

.modal.txt_active .brew-text .arrow_content {
	display: flex;
	margin-top: 20px;
}

.modal.txt_active .brew-text .arrow_box {
	position: relative;
	background: #fff;
	border: 2px solid #004896;
	border-radius: 10px;
	width: 80%;
	margin-right: 17px;
	padding: 7px;
}

.modal.txt_active .brew-text .arrow_box:after,
.arrow_box:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.modal.txt_active .brew-text .arrow_box:after {
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #fff;
	border-width: 10px;
	margin-top: -10px;
}

.modal.txt_active .brew-text .arrow_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #004896;
	border-width: 13px;
	margin-top: -13px;
}


/* FUN FAN BREW startphone */
@media screen and (max-width: 750px) {
	.modal.txt_active .brew-text .arrow_content {
		display: none;
	}

	.modal.txt_active .brew-text .list,
	.list-text {
		font-size: 10px;
		text-align: left;
	}

	.modal.txt_active .brew-text p#funfan_info {
		font-size: 9px !important;
	}

	.modal.txt_active .brew-text p {
		font-size: 12px;
		text-align: left;
		margin-bottom: 0.5rem;
	}

	.brew-table {
		font-size: 10px;
		margin-top: 20px;
		text-align: left;
	}

	.modal .img .funfan_brew_title {
		display: inline-block;
		vertical-align: bottom;
		width: 35%;
		margin: 0 auto;
	}

	.modal .img .logo.fun_fun_brew {
		display: inline-block;
		vertical-align: bottom;
		width: 40%;
		margin: 0 0 0 -20px;
	}

    .modal .detail {
    	top: 46%;
    }
}


.modal {
	font-feature-settings: "palt";
}

.modal .txt img {
	width: 86%;
	height: auto;
}


.modal .nav {
	margin: 57px 5.83% 0;
	padding-top: 15px;
	text-align: center;
	border-top: solid 1px #231815;
}

.modal .nav li {
	display: inline-block;
	width: 12%;
	margin: 15px 20px 0;
}

.modal .nav li:first-child {
	margin-left: 0;
}

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

.modal .nav li img {
	backface-visibility: hidden;
	height: auto;
	width: 100%;
	cursor: pointer;
	opacity: 0.3;
	vertical-align: middle;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

#detail01 .nav li:nth-child(1) img,
#detail02 .nav li:nth-child(2) img,
#detail03 .nav li:nth-child(3) img,
#detail04 .nav li:nth-child(4) img,
#detail05 .nav li:nth-child(5) img,
#detail06 .nav li:nth-child(6) img,
#detail06 .nav li:nth-child(7) img {
	opacity: 1;
}

.modal .nav li img:hover {
	opacity: 1 !important;
}

/* ffb */
.modal .nav_ffb {
	margin: 57px 5.83% 0;
	padding-top: 15px;
	text-align: center;
	border-top: solid 1px #231815;
}

.modal .nav_ffb li {
	display: inline-block;
	width: 24%;
	margin: 15px 20px 0;
}

.modal .nav_ffb li:first-child {
	margin-left: 0;
}

.modal .nav_ffb li:last-child {
	margin-right: 0;
}

.modal .nav_ffb li img {
	backface-visibility: hidden;
	height: auto;
	width: 100%;
	cursor: pointer;
	opacity: 0.3;
	vertical-align: middle;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

#detail06 .nav_ffb li:nth-child(1) img,
#detail07 .nav_ffb li:nth-child(2) img {
	opacity: 1;
}

.modal .nav_ffb li img:hover {
	opacity: 1 !important;
}

#modal_box .close {
	width: 73px;
	height: 73px;
	position: absolute;
	right: 0;
	z-index: 3;
	cursor: pointer;
	background-image: url(/brand/beer/img/lineup_modal_close.gif);
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
	opacity: 1;
}

#modal_box .close:hover {
	opacity: 0.6;
}


/* PC only */
@media screen and (min-width: 751px) {
	.modal .nav li:nth-child(4) {
		width: 10%;
	}

	.modal .nav li:nth-child(5) {
		width: 8%;
	}

	.modal .nav li:nth-child(6) {
		width: 12%;
	}

	.modal .nav li:nth-child(6) img {
		margin-top: -5px;
	}
}

/* smartphone ver */
@media screen and (max-width: 750px) {

	.modal .inner {
		margin: 0 35px 0 20px;
	}

	.modal .img {
		display: block;
		width: 100%;
		margin-bottom: 10px;
	}

	.modal .img .img_box {
		display: inline-block;
		vertical-align: bottom;
		width: 30%;
		margin: 0 auto;
	}

	.modal .img .logo {
		display: inline-block;
		vertical-align: bottom;
		width: 45%;
		margin: 0 0 0 -20px;
	}

	.modal .txt {
		display: block;
		width: 100%;
	}

	.modal .nav {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin: 18px 0 0;
		padding: 10px 0 0;
	}

	.modal .nav li {
		display: inline-block;
		width: 23.3%;
		margin: 10px 0 0;
		box-sizing: border-box;
	}

	.modal .nav li:not(:nth-child(3n+1)) {
		margin-left: 5%;
	}

	.modal .nav li img {
		max-width: 101px;
	}

	.modal .nav li:nth-child(4) {
		padding: 0 3%;
	}

	.modal .nav li:nth-child(5) {
		padding: 0 4.8%;
	}

	.modal .nav li:nth-child(6) {
		margin-top: 7px;
		padding: 0 1%;
	}

  /* ffb */
	.modal .nav_ffb {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		margin: 18px 0 0;
		padding: 10px 0 0;
	}

	.modal .nav_ffb li {
		display: inline-block;
		width: 44.3%;
		margin: 10px 0 0;
		box-sizing: border-box;
	}

	.modal .nav_ffb li:not(:nth-child(3n+1)) {
		margin-left: 5%;
	}

	.modal .nav_ffb li img {
		max-width: 101px;
	}

	.modal .nav_ffb li:nth-child(4) {
		padding: 0 3%;
	}

	.modal .nav_ffb li:nth-child(5) {
		padding: 0 4.8%;
	}

	.modal .nav_ffb li:nth-child(6) {
		margin-top: 7px;
		padding: 0 1%;
	}

	.modal .img .logo img {
		width: 100%;
		height: auto;
	}

	#modal_box .close {
		width: 35px;
		height: 35px;
		background-size: 35px;
	}
}

/* ------------ brewery ------------ */
.brewery {
	overflow: hidden;
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100vh;
	background-position: center 20%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}

#brewery {
	background-image: url(/brand/beer/img/brewery_01_bg.jpg);
}

#brewery02 {
	background-image: url(/brand/beer/img/brewery_02_bg.jpg);
}

#brewery03 {
	background-image: url(/brand/beer/img/brewery_03_bg.jpg);
	background-position: 38% 50%;
}

#brewery04 {
	background-image: url(/brand/beer/img/brewery_04_bg.jpg);
}

.brewery .section {
	padding: 0 80px;
}

.brewery .inner {
	position: relative;
	max-width: 1240px;
	min-height: 100vh;
	margin: 0 auto;
}

.brewery .txt {
	position: absolute;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #fff;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

#brewery .txt {
	width: 100%;
	text-align: center;
}

#brewery02 .txt,
#brewery04 .txt {
	left: 0;
}

#brewery03 .txt {
	right: 0;
}

.brewery .txt h2 {
	margin-bottom: 80px;
	opacity: 0;
}

.brewery .txt h2 img {
	width: 183px;
	height: auto;
}

.brewery .txt h3 {
	margin-bottom: 20px;
	font-size: 25px;
	opacity: 0;
	line-height: 1.8;
	text-shadow: 0px 0px 3px #000000, 0px 0px 10px #000000, 0px 0px 10px #000000;
	font-weight: normal;
}

.brewery .txt p {
	font-size: 18px;
	line-height: 2;
	text-shadow: 0px 0px 3px #000000, 0px 0px 10px #000000, 0px 0px 10px #000000;
}

.brewery .txt h2,
.brewery .txt h3,
.brewery .txt p {
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-ms-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
	opacity: 0;
}

.brewery .txt h2.active,
.brewery .txt h3.active,
.brewery .txt p.active {
	opacity: 1;
}

.brewery .txt p .br_pc {
	display: none;
}

.brewery .txt p .br_sp {
	display: block;
}

@media screen and (max-width: 750px) {
	.brewery {
		background-attachment: inherit;
	}

	.brewery .txt {
		margin-top: 0 !important;
	}

	.brewery .section {
		padding: 0 40px 0 30px;
	}

	#brewery02 .txt,
	#brewery04 .txt {
		left: auto;
		width: 100%;
	}

	#brewery03 .txt {
		right: auto;
		width: 100%;
	}

	.brewery .txt h2 {
		margin-bottom: 20px;
	}

	.brewery .txt h3 {
		margin-bottom: 20px;
		font-size: 16px;
		line-height: 1.5;
		margin-bottom: 15px;
	}

	.brewery .txt p {
		font-size: 13px;
		text-align: left;
		line-height: 1.8;
	}

	.brewery .txt p br {
		display: none;
	}

	.brewery .txt h3,
	.brewery .txt p {
		text-shadow: 0px 0px 3px #000000, 0px 0px 3px #000000, 0px 0px 3px #000000, 0px 0px 10px #000000, 0px 0px 10px #000000, 0px 0px 10px #000000, 0px 0px 10px #000000;
	}

	.brewery .txt p .br_pc {
		display: block;
	}

	.brewery .txt p .br_sp {
		display: none;
	}
}

/* ------------ harmony ------------ */
#harmony {
	position: relative;
	width: 100%;
	background-color: #fff;
	z-index: 1;
}

#harmony .section {
	width: 100%;
	font-size: 0;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 20px;
}

#harmony .section ul {
	font-size: 0;
	text-align: center;
	width: 100%;
	margin: 0 auto 30px auto;
}

#harmony .section ul li {
	display: inline-block;
	margin: 0 40px;
}

#harmony .section ul li:first-child {
	margin-left: 0;
}

#harmony .section ul li:last-child {
	margin-right: 0;
}

#harmony .section .bnr {
	max-width: 953px;
	margin: 20px auto 0 auto;
}

#harmony .section ul+.bnr {
	margin-top: 40px;
}

#harmony .section .bnr a {
	display: block;
}

#harmony .section .bnr a img {
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 1;
	width: 100%;
	height: auto;
	background-color: #fff;
}

#harmony .section .bnr a:hover img {
	opacity: 0.7;
}

@media screen and (max-width: 1200px) {
	#harmony .section ul {
		width: 680px;
	}

	#harmony .section ul li {
		margin: 0 10px;
	}
}

@media screen and (max-width: 750px) {
	#harmony {
		position: relative;
		background-color: #004892;
		height: auto !important;
		min-height: 0 !important;
	}

	#harmony .section {
		background-color: #fff;
		position: static;
		-webkit-transform: translate(0);
		transform: translate(0);
		margin-top: 0 !important;
		padding: 20px 20px 20px 20px;
	}

	#harmony .section ul {
		width: 100%;
		max-width: 400px;
		display: none;
	}

	#harmony .section ul li {
		width: 30%;
		margin-right: 5%;
		margin-left: 0;
	}

	#harmony .section ul li:nth-child(1),
	#harmony .section ul li:nth-child(2),
	#harmony .section ul li:nth-child(3) {
		margin-bottom: 5%;
	}

	#harmony .section ul li:nth-child(3) {
		margin-right: 0;
	}

	#harmony .section ul li img {
		max-width: 120px;
		width: 100%;
		height: auto;
		margin: 0 auto;
	}

	#harmony .section .bnr {
		margin: 10px auto 0 auto;
	}

	#harmony .section ul+.bnr {
		margin-top: 0;
	}
}

/* ------------ footer ------------ */
#footer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	/*background-color: #004892;
	color: #fff;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	text-align: left;*/
}

/*#footer .inner {
	position: relative;
	padding: 25px;
}

#footer .logo {
	width: 256px;
	margin-bottom: 15px;
}

#footer .logo img {
	width: 100%;
	height: auto;
}

#footer ul {
	font-size: 0;
}

#footer ul li a {
	text-decoration: none;
}

#footer ul li a:hover {
	text-decoration: underline;
}*/

#footer .link01 {
	margin-bottom: 5px;
}

#footer .link01 li {
	display: inline-block;
	font-size: 14px;
}

#footer .link02 {
	margin-bottom: 5px;
}

#footer .link02 li {
	display: inline-block;
	font-size: 11px;
	margin-right: 5px;
}

#footer p {
	/*font-size: 9px;*/
}

#footer .note {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

#footer .note li {
	font-size: 10px;
	line-height: 1.5em;
}

@media screen and (max-width: 750px) {
	#footer {
		position: static;
		background: #fff;
	}

	#footer .inner {
		padding: 15px;
	}

	#footer .logo {
		width: 180px;
		margin-bottom: 10px;
	}

	#footer .link01 {
		margin-bottom: 0;
	}

	#footer .link01 li {
		font-size: 12px;
	}

	#footer .link02 {
		margin-bottom: 0;
	}

	#footer .note {
		position: static;
	}

	#footer .note li {
		font-size: 8px;
	}
}

.footer-sns__line__title p,
.footer-sns__twitter__title p,
.footer-sns__mail__title p {
	text-align: left;
}

.site-footer .footer-link__item a {
	font-size: 14px;
}

.footer-share__desc {
	font-size: 14px;
}

/* ------------ slider ------------ */
.slick-slider {
	position: relative;
	display: block;
	box-sizing: border-box;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
	-khtml-user-select: none;
	-ms-touch-action: pan-y;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
	max-width: 1600px;
	margin: 0 auto;
}

.slick-list {
	position: relative;
	display: block;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

.slick-list:focus {
	outline: none;
}

.slick-list.dragging {
	cursor: pointer;
	cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.slick-track {
	position: relative;
	top: 0;
	left: 0;
	display: block;
}

.slick-track:before,
.slick-track:after {
	display: table;
	content: '';
}

.slick-track:after {
	clear: both;
}

.slick-loading .slick-track {
	visibility: hidden;
}

.slick-slide {
	display: none;
	float: left;
	height: 100%;
	min-height: 1px;
}

[dir='rtl'] .slick-slide {
	float: right;
}

.slick-slide img {
	display: block;
}

.slick-slide.slick-loading img {
	display: none;
}

.slick-slide.dragging img {
	pointer-events: none;
}

.slick-initialized .slick-slide {
	display: block;
}

.slick-loading .slick-slide {
	visibility: hidden;
}

.slick-vertical .slick-slide {
	display: block;
	height: auto;
	border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
	display: none;
}

/* Arrows */
.slick-prev,
.slick-next {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 65%;
	display: block;
	width: 50px;
	height: 50px;
	padding: 0;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	cursor: pointer;
	color: transparent;
	border: none;
	outline: none;
	background: transparent;
	z-index: 1;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-ms-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

.slick-prev {
	right: 50%;
	margin-right: 200px;
	background-image: url(/brand/beer/img/lineup_arrow_prev.png);
}

.slick-next {
	left: 50%;
	margin-left: 200px;
	background-image: url(/brand/beer/img/lineup_arrow_next.png);
}

.slick-prev:hover,
.slick-next:hover {
	opacity: 0.6;
}

.slick-disabled {
	cursor: auto;
	opacity: 0.2 !important;
}

@media screen and (max-width: 750px) {

	.slick-prev,
	.slick-next {
		width: 25px;
		height: 25px;
		background-size: 25px;
		margin-top: -6px;
	}

	.slick-prev {
		right: auto;
		left: 50px;
		margin-right: 0;
	}

	.slick-next {
		left: auto;
		right: 50px;
		margin-left: o;
	}
}

/* ------------ anchor_load ------------ */
#anchor_load {
	position: fixed;
	right: 30px;
	top: 50%;
	z-index: 10;
	margin-top: -65px;
}

#anchor_load li {
	margin-top: 22px;
}

#anchor_load li:first-child {
	margin-top: 0;
}

#anchor_load li a {
	background-color: rgba(255, 255, 255, 0.3);
	border: 2px solid #fff;
	display: block;
	width: 12px;
	height: 12px;
	border-radius: 16px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	-webkit-transition: background 0.2s;
	-moz-transition: background 0.2s;
	-ms-transition: background 0.2s;
	-o-transition: background 0.2s;
	transition: background 0.2s;
	text-indent: -999999px;
}

#anchor_load.blu li a {
	background-color: rgba(0, 72, 150, 0.5);
	border: 2px solid #004896;
}

#anchor_load li.active a,
#anchor_load li a:hover {
	background-color: rgba(255, 255, 255, 1);
}

#anchor_load.blu li.active a,
#anchor_load.blu li a:hover {
	background-color: rgba(0, 72, 150, 1);
}

@media screen and (max-width: 750px) {
	#anchor_load {
		right: 8px;
		margin-top: -47px;
	}

	#anchor_load li {
		margin-top: 15px;
	}

	#anchor_load li a {
		width: 8px;
		height: 8px;
	}
}

/* ------------ scrollBtn ------------ */
.scrollBtn {
	position: fixed;
	bottom: 30px;
	left: 50%;
	margin-left: -25px;
	z-index: 1;
}

.scrollBtn a {
	display: block;
	text-indent: -999999px;
	background-image: url(/brand/beer/img/btn_arrow.png);
	width: 50px;
	height: 50px;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}

.scrollBtn a:hover {
	opacity: 0.6;
}

@media screen and (max-width: 750px) {
	.scrollBtn {
		bottom: 10px;
		margin-left: -15px;
	}

	.scrollBtn a {
		width: 30px;
		height: 30px;
		background-size: 30px;
	}
}

/* ------------ shop_bnr ------------ */
#shop_bnr {
	padding: 40px 0 0 0;
	text-align: center;
}

#shop_bnr img {
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
	opacity: 1;
}

#shop_bnr img:hover {
	opacity: 0.6;
}

@media screen and (max-width: 750px) {
	#shop_bnr {
		padding: 20px 0 0 0;
	}
}

/* ------------ medal ------------ */
#lineup #second ul li {
	position: relative;
}

#lineup #second ul li .medal {
	position: absolute;
	right: 10%;
	top: 0;
	width: 25%;
}

#lineup #third ul li {
	position: relative;
}

#lineup #third ul li .medal {
	position: absolute;
	right: 10%;
	top: 0;
	width: 25%;
}

.modal .img {
	position: relative;
}

.modal .txt .medal_txt {
	position: relative;
	margin-left: 10%;
	margin-bottom: 2%;
	max-width: 512px;
}

.modal .txt .medal_txt img {
	width: 100%;
	max-width: 260px;
	height: auto;
}

.modal .txt .medal_txt a {
	backface-visibility: hidden;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 28%;
	height: 0;
	padding-top: 3%;
	font-size: 0;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-ms-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
	opacity: 0;
	background-color: #fff;
}

.modal .txt .medal_txt a:hover {
	opacity: 0.4;
}

@media screen and (max-width: 750px) {
	.modal .txt .medal_txt.null {
		display: none;
	}

	#shop_bnr img {
		width: 100%;
	}
}

/* FUN FAN BREW 追加 */
.funfan_brew_lbox_pc {
  display: block;
  width: 30%;
  padding-left: 5%;
  z-index: 5;
}

.funfan_brew_rbox_pc {
/*   width: 70%; */
}

.products-detail__shop {
	margin: 50px auto 0;
}

/* 2023-08-02 25周年キャンペーンバナー */
.campaign_banner_25th {
	display: none;
	position: fixed;
	bottom: 0;
	right: 0;
	margin-right: 10px;
	margin-bottom: 10px;
	z-index: 9999999;
}

@media screen and (max-width: 750px) {
	.campaign_banner_25th {
		box-sizing: border-box;
		width: 100%;
		bottom: 0;
		left: 0;
		margin: 0;
	}
}


