

/*SP・767px以下の場合*/
@media (max-width: 767px) {



h1,h2,h3,h4,h5 {margin: 0;}

/* ==========================================================================
背景
========================================================================== */


.red {color:#E4535E;}
.yellow {color: #FFC914;}


.kaitei-box .type-pc {display: none;}

.kaitei-box {width: 100%;
margin-top: 45px;
margin-bottom: 45px;
text-align: center;}
.kaitei-box img {max-width: 100%;
padding: 0 30px;}

#online_btn {display: none;}


/* ==========================================================================
フォント
========================================================================== */

.eng {font-family: "Futura-CondensedMedium", "Futura", sans-serif;
font-stretch: condensed;
font-weight: normal;
}
.min {font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;}

p {font-size: 14px;}

/* ==========================================================================
ヘッダー
========================================================================== */

#header .header-wrap {position: relative;
	background-color: #210700;}

#header .header-pagewrap {height: 100px;
background-color: #fff;
max-width: 1180px;
margin: 0 auto;}

#header .page-head {position: relative;}

#header .page-head .page-logo {width: 200px;
margin: 0 auto;
padding-top: 24px;
text-align: center;}

#header .page-head .page-logo img {width: 148.5px;
height: 30px;}

#header .page-head .page-logo h2 {font-size: 14px;
color: #666;
margin-top: 14px;
letter-spacing: 0.5em;
text-indent:0.5em;}

#header .page-head .social {position: absolute;
right: 20px;
top:32px;
display: none;}

#header .page-head .social li {margin-right: 30px;}
#header .page-head .social li:last-child {margin-right: 0;}

#header #page-breadcrumb .breadcrumb {position: absolute;
right: 20px;
top:80px;
overflow: hidden;
background-color: #fff;
margin: 0px;
padding: 0px;
display: none;}

#header #page-breadcrumb .breadcrumb li {float: none;}
.breadcrumb-next {margin: 0px 15px;}


/*　ナビ */

#gnav {width: 100%;
margin: 0 auto;
border-bottom: 1px #ccc solid;
overflow: hidden;
height: 64px;}

.gnav-wrapper {}

.gnav-inner {display: table;
margin: 0 auto;}

.gnav-sp {width: 100%;}

#gnav h1 {float: left;
display: table;
margin-right: 40px;
line-height: 64px;}

.nav {display: table;}

.nav li {margin: 0;
margin-right: 40px;
line-height: 54px;
width: 100%;
border-bottom: 1px solid #ccc;}

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

.nav li a {color: #333;
	padding:0;}

.gnav-pc {display: none;}

.go-to-shopping {float: right;
position: absolute;
right: 15px;
height: 64px;
}

.go-to-shopping i {line-height: 64px;
height: 64px;}

.go-to-shopping a {color: #000;}


/*　固定ナビ */
/*#F9B704*/

  #gnav-fix {width: 100%;
    background-color:rgba(249,183,4,0.8);
    height: 64px;
  /*overflow: hidden;*/
position: fixed;
top:-64px;
-webkit-transform: 0.3s;
   -moz-transform: 0.3s;
    -ms-transform: 0.3s;
     -o-transform: 0.3s;
        transform: 0.3s;
        z-index: 1;
}


#gnav-fix.clear {
  top: 0px;
  transition: 0.8s!important;
}

.gnav-fix-wrapper {width: 100%;}

.gnav-fix-inner {
  display: table;
margin: 0 auto;}

#gnav-fix h1 {float: left;
display: table;
margin: 0 auto;
text-align: center;
line-height: 64px;}

.hb-menu {font-size: 10px;
padding-top: 12px;}


.drawer-nav .drawer-menu li {padding-left: 20px;}

.drawer-nav {background-color:rgba(255,255,255,0.9)!important;}



/*　メインイメージ */

#header .mainimg-top {/*background: url(../img/bg/mainimg-top02.jpg) no-repeat center center;*/
  background-color: #fdd108;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}

  .mainimg-top .catchcopy {text-align: center;
  	font-size: 38px;
  width: 100%;
  position: absolute;
  top: 160px;
  }


/*　下層メインイメージ */

.sub-mainimg {width: 100%;
overflow: hidden;}

.sub-mainimg .sub-mainimg-inner {width: 100%;
  max-width: 1480px;
  height: 240px;
  margin: 0 auto;
  position: relative;
  display: block;
  background-position: center center;
  background-size: cover;} 

.sub-mainimg-inner .titlebox {text-align: center;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%); /* Safari */
  -ms-transform: translateY(-50%); /* IE 9 */
  transform: translateY(-50%);
-moz-text-shadow:-1px -1px 1px #111, 1px 1px 1px #000;
-webkit-text-shadow:-1px -1px 1px #111, 1px 1px 1px #000;
color: #ffffff;}

.sub-mainimg .titlebox h2 {font-size: 14px;}
.titlebox .page-title {font-family: 'Dancing Script', cursive;
font-size: 32px;}
.o-moji {font-family: 'Rock Salt', cursive;
}


#about-page .sub-mainimg-inner {background: url(../img/bg/about/sub-mainimg.jpg) no-repeat;}
#products-page .sub-mainimg-inner {background: url(../img/bg/products/sub-mainimg.jpg) no-repeat;}
#company-page .sub-mainimg-inner {background: url(../img/bg/company/sub-mainimg.jpg) no-repeat;}
#shoplist-page .sub-mainimg-inner {background: url(../img/bg/shoplist/sub-mainimg.jpg) no-repeat;}
#store-page .sub-mainimg-inner {background: url(../img/bg/store/sub-mainimg.jpg) no-repeat;}
#contact-page .sub-mainimg-inner {background: url(../img/bg/contact/sub-mainimg.jpg) no-repeat;}
#faq-page .sub-mainimg-inner {background: url(../img/bg/faq/sub-mainimg.jpg) no-repeat;}
#news-page .sub-mainimg-inner {background: url(../img/bg/news/sub-mainimg.jpg) no-repeat;}
#blog-page .sub-mainimg-inner {background: url(../img/bg/blog/sub-mainimg.jpg) no-repeat;}
#policy-page .sub-mainimg-inner {background: url(../img/bg/policy/sub-mainimg.jpg) no-repeat;}
#event-page .sub-mainimg-inner {background: url(../img/bg/event/sub-mainimg.jpg) no-repeat center center;}
#masaji-beer-page .sub-mainimg-inner {background: url(../img/bg/masaji/sub-mainimg.jpg) no-repeat;}
#hanpukai-page .sub-mainimg-inner {background: url(../img/bg/hanpukai/sub-mainimg.jpg) no-repeat;}
#notfound-page .sub-mainimg-inner {background: url(../img/bg/notfound/sub-mainimg.jpg) no-repeat;}
#ttt-page .sub-mainimg-inner {background: url(../img/bg/ttt/sub-mainimg.jpg) no-repeat center center;}
.sub-mainimg-inner {background-size:cover!important;
 }

notfound-page

/*　コンテンツ幅 */

.view-pc {width: 100%;
padding: 0px 15px!important;
margin: 0 auto;}

.japan-wrap,.info-company,.message,.warehouse-wrap,.beerbelly-wrap,.faq-block,.contact-info-wrap {padding: 0px 15px!important;}
.classic-lineup,.season-lineup {width: 340px;
margin: 0 auto;}
.japan .titlebox-j{margin: 0 auto;}
.aria-japan {padding-top: 24px!important;}

#PickupArea .sub-text {padding: 0 15px;}


/* ======================================================================================================================
◆404ページ◆
====================================================================================================================== */

#notfound-page .sub-mainimg {margin-bottom: 60px;}

/* ======================================================================================================================
◆トップページ◆
====================================================================================================================== */

.newsfeed-box {margin-top: 40px;
margin-bottom: 20px;}

.newslist .titbox {margin-bottom: 14px;}
.newslist .titbox time {margin-bottom: 6px;
font-size: 11px;
color: #777;}
.newslist .titbox h3 {font-size: 14px;
line-height: 1.4;}
.newslist .titbox h3 a {color:#333;}


.newsfeed-lbox {text-align: center;
padding: 12px 0px;
background-color: #fdd108;
color: #333;
font-size: 14px;
font-weight: bold;}

.newsfeed-rbox {padding: 15px;}

.attention01 {font-size: 14px;
color: red;
border: 1px solid #962D2D;
margin: 0 auto 20px;
text-align: center;
padding: 4px 12px;
display: table;}

.attention02 {margin-bottom: 40px;

}


.attention {margin:0 15px;}

.attention-please {width: 100%;
text-align: center;
padding: 12px 0px;
background-color: #fdd108;
margin: 20px 0;}

.attention-please p {font-size: 14px;
margin-bottom: 0;}

.attention-please a {color: #333;}


/*FaceBook*/
#facebook .fb-inner {display: table;
margin: 0 auto;}



/*オススメ*/
#PickupArea {margin-bottom: 40px;}
#PickupArea .pickupbox .pickup-bn img {max-width: 100%;}
#PickupArea .pickupbox .pickup-bn {margin-bottom: 10px;}

/* コンセプト */

#conceptArea {border-bottom: 1px solid #ccc;
background-color: #ccc;
}


.concept-bg {
    background: url(../img/bg/concept-back.jpg) no-repeat center center;
  background-size:cover;
  overflow: hidden;
}



.conceptwrap {
width: 100%;
height: 100%;
  background: url(../img/bg/sp-top_concept_back.png) repeat center center;
}


.concept-inner {width: 100%;
  padding: 0 15px;
  margin: 0 auto;
position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);}

.concept-inner h2 {
  margin-top: 20px;
margin-bottom:20px;
text-align: center;
line-height: 1.4;
font-size: 18px;}

#conceptArea .catchcopy {font-family: 'Dancing Script', cursive;
font-size: 42px;
color: #962D2D;
line-height: 1;
margin-bottom: 0;
text-align: center;
transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
margin-bottom: 40px;}

.concept-catch {display: none;}

.concept-txt {text-align: center;
font-size: 14px;
line-height: 2;}

.cf01 {color:#E4BF65;
font-size: 32px;
margin-bottom: 60px;}
.cf02 {font-size: 38px;
margin-bottom: 60px;
font-weight: bold;}
.cf03 {font-size: 16px;
line-height: 2.4;}

.contentsArea-wrap {margin-top: 15px;
  margin-bottom: 40px;
width: 100%;
overflow: hidden;}
.contentsArea-wrap img {padding: 2px;}
.contentsArea-inner {margin: 0 15px;}



#go-to-contentsArea01 img {max-width: 100%;}
#go-to-contentsArea02 img {max-width: 100%;}

/*#go-to-contentsArea01 figure {background-color: rgba(0,0,0,0.4);}*/


#go-to-contentsArea01 .top-contents-title {color: #fff;
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);
  text-align: center;
  display: table;
}
#go-to-contentsArea02 .top-contents-title {color: #fff;
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);
  text-align: center;
  display: table;
}

.relative {position: relative;}


.f01 {font-family: 'Dancing Script', cursive;
font-size: 36px;
margin: 0;
line-height: 1;}

.top-contents-title .mikiri {border-bottom: 1px #962D2D solid;
width: 50%;
height: 1px;
margin: 12px auto;
}

.top-contents-title h3 {font-size: 16px;
}


.sub-text {color: #777;
line-height: 1.4;
margin: 0;
font-size: 12px;}

/*商品紹介*/

#ItemArea {
margin-bottom: 120px;}

#ItemArea .itemwrap {width: 100%;
padding: 0 15px;}


.regular-lineup-sp {display: table;
margin: 0 auto;}

.regular-lineup-sp li {text-align: center;
margin: 0 auto;}


.slick-slide img {text-align: center;
margin: 0 auto;}

.slick-list {margin-bottom: 20px;}

.item-titlebox {text-align: center;
}

.item-titlebox h2,.blog-titlebox h2 {margin-bottom: 20px;
letter-spacing: 1em;
text-indent:1em;
font-size: 24px;}

.item-titlebox h3 {color: #333;
}

.item-titlebox-inner {margin-bottom: 40px;}

.regular-lineup-sp ul {overflow: hidden;}

.regular-lineup-sp li {
text-align: center;
vertical-align: bottom;}
.regular-lineup-sp li:last-child {margin-right: 0px;}

.regular-lineup-sp {margin-bottom: 40px;}


.regular-lineup-pc {display: none;}

.limited-lineup-sp {width: 100%;
  overflow: hidden;
line-height: 1.6;
font-size: 14px;}
.relative {position: relative;}
.limited-lineup .lineup06 {background: url(../img/bg/lineup06.jpg) no-repeat;
  background-size: contain;
	width: 48%;
  float: left;
overflow: hidden;
height: 80px;}
.limited-lineup .lineup07 {background: url(../img/bg/lineup07.jpg) no-repeat;
  background-size: contain;
	width: 48%;
  float: right;
overflow: hidden;
height: 80px;}
.limited-lineup .lineup08 {background: url(../img/bg/lineup08.jpg) no-repeat;
  background-size: contain;
	width: 48%;
  float: left;
overflow: hidden;
height: 80px;}
.limited-lineup .lineup09 {background: url(../img/bg/lineup09.jpg) no-repeat;
  background-size: contain;
	width: 48%;
  float: right;
overflow: hidden;
height: 80px;}
.limited-lineup h3 {
text-align: center;
color: #fff;
font-size: 16px;
height: 80px;
line-height: 80px;}

.lineup06,.lineup07,.lineup08,.lineup09 {
float: left;
margin-bottom: 20px;}

.lineup06 a,.lineup07 a,.lineup08 a,.lineup09 a {width: 100%;
height: 80px;
display: block;
position: absolute;
top:0;
left: 0;}

.lineup06 p,.lineup07 p,.lineup08 p,.lineup09 p {display: none;}

.r120 {margin-right: 0px;}
.b40 {margin-bottom: 0px;}

#newsArea {margin-bottom: 40px;
  width: 100%;}

.news-banner img {max-width: 100%;}

#newsArea .news-banner {margin-bottom: 4px;}


.gift .bannerbox {margin-bottom: 10px;}

.gift {margin-bottom: 60px;}



/*ブログ*/

#blogdetailArea .blog-map iframe {max-width:100%;}
#blogdetailArea .blog-map {margin-bottom: 40px;}

.blog-top-wrapper {width: 100%;
margin: 0 auto;
margin-bottom: 60px;}

.blog-top-inner {overflow: hidden;}

.blog-titlebox {text-align: center;
margin-bottom: 30px;}

.title-shikiri {width: 100px;
height: 2px;
border-bottom: 2px solid #FFC914;
margin: 0 auto;
margin-bottom: 60px;}


.blogbox {
  padding: 0px 15px;
}

.blogbox h3 {font-size: 16px;}
.blogbox h3 a {color: #333;}

.blogbox time {font-size: 11px;
color: #ccc;}

.blogbox:last-child {margin-right: 0;}

.blogbox img {margin-bottom: 10px;
max-width: 100%;
height: 100%;}

.blog-ichiran {margin-bottom: 80px;
text-align: center;
font-size: 12px;
font-weight: bold;}

.blog-ichiran-btn {display: table;
padding: 12px 120px;
border: #333 solid 1px;
margin: 0 auto;}



.blog-top-inner .slick-dots {/*width: 200px!important;*/
display: table!important;
margin: 0 auto!important;}

.slick-prev .slick-arrow {background-color: #000!important;
height: 100%!important;}
.slick-next .slick-arrow {background-color: #000!important;
height: 100%!important;}


#blogdetailArea {margin-top: 80px;}
.blog-sentence p {margin-bottom: 20px;}
.blog-sentence img {max-width: 100%;
height: auto;}

#blogdetailArea .titlebox-bd h2 {font-size: 24px;
padding-bottom: 12px;
border-bottom: 1px #ccc solid;
margin-bottom: 12px;
line-height: 1.4;}

#blogdetailArea .titlebox-bd {margin-bottom: 60px;}
#blogdetailArea .titlebox-bd p {margin-bottom: 2px;}


#blogpageArea .blog-archive {padding-bottom: 20px;
border-bottom: 1px solid #ccc;
margin-bottom: 20px;}

#blogpageArea .blog-archive .imgbox {text-align: center;
margin-bottom: 20px;}

#blogpageArea .blog-archive .textbox h2 {font-size: 24px;
line-height: 1.4;}
#blogpageArea .blog-archive .textbox h2 a {color: #333;
text-decoration: underline;}


/*フッター*/

#footer {background-color: #fdd108;
padding: 60px 0px 0px;}


.foot-nav {display: none;}

.foot-nav .shikiri {margin: 0px 20px;}

.foot-nav ul {display: table;
	margin: 0px auto;
text-align: center;}

.foot-nav li a {color: #fff;
}


.copyright {text-align: center;
color: #ccc;
font-size: 11px;
padding: 8px 0;
background-color: #000;}


.move {right: 20px;
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -ms-filter: "alpha(opacity=$num)";
    }

/* nagamatsu edit start */
#online_btn {
		position: fixed;
    right: -200px;
    bottom: 200px;
		transition: 0.3s;
}
#online_btn.clear {
	right: 0px;
	transition: 0.8s!important;
}
/* nagamatsu edit end */

.{    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transform: scale(0.7);
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -ms-transform: scale(0.7);
    -ms-filter: "alpha(opacity=$num)";
    opacity: 0;
    z-index: 50;}


.page-logo {}


.lbox {float: left;}
.rbox {float: right;}


.foot-address {margin-bottom: 30px;
overflow: hidden;
text-align: center;
width: 100%;}

.foot-address h2 {
font-size: 24px;
margin-bottom: 18px;
}

.foot-address address {
margin-bottom: 0;}

.foot-address address p {
font-size: 14px;}
.place {margin-bottom: 6px;}
.foot-address .shikiri {display: none;}
.foot-address address .tel {margin-bottom: 18px;
font-size: 18px;
font-weight: bold;
color: #333;}

.foot-address .f-go-contact {width: 60%;
padding: 6px 12px;
background-color: #333;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
font-size: 14px;
color: #fff;
margin: 0 auto;}

.foot-address .f-go-contact a {color: #fff;}

.foot-address .zip {font-size: 12px;
margin-right: 8px;}

.foot-nav-under {overflow: hidden;
margin-bottom: 40px;}

.follow-us {text-align: center;
margin-bottom: 6px;
font-weight: bold;
font-size: 16px;}

.foot-social-inner {display: table;
margin: 0 auto;}

.foot-social li {
border: 1px #333 solid;
height: 48px;
line-height: 48px;
border-radius: 48px;
-webkit-border-radius: 48px;
-moz-border-radius: 48px;
margin-right: 20px;
}

.foot-social li:last-child {margin-right: 0;}

.foot-social li i {width: 48px;
height: 48px;
line-height: 48px;
text-align: center;
vertical-align: middle;}

.foot-social li a {
color: #333;
}

.foot-nav-under .foot-nav-other {display: none;}



/* ======================================================================================================================
◆下層共通◆
====================================================================================================================== */

.tit-under {width: 100px;
border-bottom: 2px solid #962D2D;
display: table;
margin: 0 auto;
margin-bottom: 60px;
}

.tit-h2 {text-align: center;
font-size: 24px;
font-weight: bold;
letter-spacing: 0.2em;
text-indent:0.2em;
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

main {margin-bottom: 160px;}

.tac {text-align: center;} 



/* ======================================================================================================================
◆箕面ビールとはページ◆
====================================================================================================================== */

#about-page .sub-mainimg {margin-bottom: 60px;}
#about-page .explain {overflow: hidden;}
.explain .textbox {margin-top: 20px;
margin-bottom: 80px;}
#about-page .explain h3 {font-size: 32px;
line-height: 1.2;
color: #555;
font-weight: 100;
}
.f18 {font-size: 18px;
font-weight: bold;
color: #555555;}

.f27 {font-size: 20px;
font-weight: bold;
color: #555555;
padding-bottom: 2px;
border-bottom: 2px #E4BF65 solid;}

.kodawari-txt {display: none;}

.aboutblock .textbox {width: 80%;
display: table;
margin-top: 40px;}
.aboutblock .textbox h3 {margin-bottom: 20px;
font-size: 18px;
line-height: 1.4;}

.about01 {width: 100%;
  height: 400px;
  background: url(../img/bg/about/concept1-sp.jpg) no-repeat;
background-size: cover;
color: #fff;
padding-left: 10%;}

.about02 {width: 100%;
  height: 400px;
  background: url(../img/bg/about/concept2-sp.jpg) no-repeat;
background-size: cover;}

.about02 .textbox {float: right;}

.about03 {width: 100%;
  height: 400px;
  background: url(../img/bg/about/concept3-sp.jpg) no-repeat;
background-size: cover;
color: #fff;
padding-left: 60px;}

.about04 {width: 100%;
  height: 400px;
  background: url(../img/bg/about/concept4-sp.jpg) no-repeat;
background-size: cover;}

.about04 .textbox {float: right;}

.about05 {width: 100%;
  height: 400px;
  background: url(../img/bg/about/concept5-sp.jpg) no-repeat;
background-size: cover;
padding-left: 60px;
}

.aboutblock {margin-bottom: 80px;}
.award-tit {margin-bottom: 40px;}
.award-tit h3 {text-align: center;}

.award-list .col-md-6 {padding: 0!important;}

.awardbox {margin-bottom: 15px;}

.awardbox h4 {color: #fff;
background-color: #000;
padding: 8px 0px;
text-align: center;
font-size: 14px;
margin-bottom: 32px;}

.award-detail {overflow: hidden;
line-height: 1.2;
width: 100%;}
.award-product-img {float: left;
margin-right: 4%;
width: 12%;
text-align: center;}
.award-result-img {
  float: left;
width: 20%;}
.award-txt {float: left;
  width: 60%;
margin-right: 4%;}
.award-product-img img {max-width: 100%;}
.award-result-img img {max-width: 100%;}

.award-products {font-weight: bold;
padding-bottom: 8px;
border-bottom: 1px #999 dotted;}
.award-result {color: #962D2D;}

.award-detail {margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px dotted #ccc;}

.award-detail:last-child {border-bottom: none;}


/* ======================================================================================================================
◆店舗紹介ページ◆
====================================================================================================================== */

#store-page .sub-mainimg {margin-bottom: 80px;}

.warehouse {margin-bottom: 80px;}
.warehouse-wrap {overflow: hidden;
margin-bottom: 40px;}
.warehouse .lbox {width: 100%;}
.warehouse .lbox img {max-width: 100%;}
.warehouse h2 {font-size: 42px;
color: #333;
margin-bottom: 48px;}
.warehouse h3 {font-size: 18px;
color: #333;
margin-bottom: 28px;
font-weight: bold;
line-height: 1.6;}
.sentence-b {line-height: 2;
font-size: 14px;
color: #333;margin-bottom: 40px;}
.warehouse .rbox {width: 100%;
margin-top: 48px;}
.info-warehouse {overflow: hidden;
width: 100%;}
.info-warehouse dt {float: left;
width: 100%;
padding: 10px 0px;
font-weight: bold;}
.info-warehouse dd {
  width: 100%;
padding: 10px 0px;
margin-bottom: 10px;
border-bottom: 1px solid #ccc;}

.slick-dots {width: 150px!important;
  margin: 0px auto!important;
  position: relative!important;
  padding-top: 20px!important;
  bottom:0px!important;
}

.tenma {font-size: 34px;
font-weight: bold;}

.beerbelly {padding: 80px 0px;
background-color: #FAFAFA;
margin-bottom: 100px;
}

.beerbelly img {max-width: 100%;}
.beerbelly h2 {margin-bottom: 30px;
font-size: 38px;}
.beerbelly-tosabori {overflow: hidden;
width: 100%;}
.beerbelly-tosabori .lbox {width: 100%;}
.beerbelly-tosabori .rbox {width: 100%;
padding: 40px 0px;
background-color: #fff;
height: 520px;}
.beerbelly-tenma {overflow: hidden;
width: 100%;}
.beerbelly-tenma .lbox {width: 100%;
padding: 40px 0px;
background-color: #fff;
height: 520px;
}
.beerbelly-tenma .rbox {width: 100%;}

.goto-beerbelly {position: relative;
display: table;
margin: 0 auto;}
.goto-beerbelly .arrow {position: absolute;
right: -8px;
top:2px;
}

.goto-beerbelly p a {color: #333;
border: 1px solid #999;
padding: 12px 36px;
font-size: 12px;}


.japan {}
.japan .titlebox-j {text-align: center;
margin-bottom: 80px;}
.japan .titlebox-j h2 {margin-bottom: 40px;
font-size: 24px;
font-weight: bold;}
.japan .titlebox-j p {text-align: left;}
.aria-japan {border-top:1px dotted #ccc;
border-bottom:1px dotted #ccc;
padding: 24px 0px;
margin-bottom: 40px;
overflow: hidden;
}
.aria-japan dt {float: left;
width: 100%;
margin-bottom: 10px;}
.aria-japan dd {
width: 100%;}

.area-japan-detail h3 {margin-bottom: 18px;
font-size: 24px;
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

.effect01 {
  position: relative;
  width: 100%;
}
.effect01 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.effect01 img {
  max-width: 100%;
  vertical-align: top;
}

.effect01 a {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 1;
  display: block;
}
.effect01 a:before,
.effect01 a:after {
  width: 1px;
  height: 0;
  background-color: #ffffff;
}
.effect01 a:before {
  right: 0;
  top: 0;
}
.effect01 a:after {
  left: 0;
  bottom: 0;
}
.effect01:before,
.effect01:after,
.effect01 a:before,
.effect01 a:after {
}

.effect01:before,
.effect01:after {
  height: 1px;
  width: 0%;
}
.effect01:before {
  top: 0;
  left: 0;
}
.effect01:after {
  bottom: 0;
  right: 0;
}
.effect01:hover img,
.effect01.hover img {
  opacity: 0.25;
}
.effect01:hover a:before,
.effect01.hover a:before,
.effect01:hover a:after,
.effect01.hover a:after {
  height: 100%;
}

.effect01:hover:before,
.effect01.hover:before,
.effect01:hover:after,
.effect01.hover:after {
  width: 100%;
}
.effect01:hover:before,
.effect01.hover:before,
.effect01:hover:after,
.effect01.hover:after,
.effect01:hover a:before,
.effect01.hover a:before,
.effect01:hover a:after,
.effect01.hover a:after {
  /*opacity: 0.1;*/
}

.ws-box img {max-width: 100%;
margin-bottom: 40px;}


/* ======================================================================================================================
◆商品紹介ページ◆
====================================================================================================================== */

#products-page .sub-mainimg {margin-bottom: 80px;}

.classic-beer {margin-bottom: 120px;
overflow: hidden;}

.lineup-img-wrap {margin-bottom: 40px;
}

.lineup-img-inner .imgbox img {max-width: 100%;}


.classic-beer .lineup-img-inner .textbox-pc {background: url(../img/bg/products/back_yellow.jpg) repeat-x;
color: #fff;
padding: 40px;
width: 100%;
}

.classic-beer .textbox-pc .titlebox01 {}

.classic-beer .textbox-pc .titlebox02 {}

.classic-beer .textbox-pc .commentbox {line-height: 1.6;}

.classic-lineup {display: table;
  margin: 0 auto;
}

.lineup-inner {display: table;
  margin: 0 auto;
}


.season-beer .move-back {background-color: #eee;
/*width: 100%;
padding-top: 50px;*/
position: relative;
}

.js-scrollshow:after {-webkit-transform: scaleY(1);
    transform: scaleY(1);}

  .message {-webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    backface-visibility: hidden;}

.season-beer {width: 100%;}

.season-beer .move-back:after {
    content: '';
    width: 85.55208%;
    height: calc(100% - 55px);
    position: absolute;
    left: 0;
    top: 0;
    background-color: #eee;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    transition-property: transform;
    -webkit-transition-duration: 1.2s;
    transition-duration: 1.2s;
    -webkit-transition-timing-function: cubic-bezier(.645,.045,.355,1);
    transition-timing-function: cubic-bezier(.645,.045,.355,1);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
}


.season-beer .lineup-img-inner .textbox-pc {background: url(../img/bg/products/back_black.jpg) repeat-x;
color: #fff;
padding: 40px;
width: 100%;
}

.season-beer .imgbox {}

.season-beer .textbox-pc .titlebox01 {}

.textbox-pc .titlebox02 p {font-size: 18px;}

.season-beer .textbox-pc .commentbox {
width: 100%;
line-height: 1.6;
color: #ccc;}

.season-lineup {overflow: hidden;
display: table;
  margin: 0 auto 110px;}

.beer-cat {font-size: 24px;}
.beer-cat-big {font-size: 36px;}


.lineup-box {width: 150px;
float: left;
overflow: hidden;
margin: 0 10px;
margin-bottom: 30px;}
.lineup-box:last-child {margin-bottom: 0;}
.lineup-box img {margin-bottom: 15px;
max-width: 100%;}
.lineup-box .text-box {width: 140px;
display: table;
margin: 0 auto;}
.lineup-box h3 {text-align: center;
border-bottom: 1px solid #962D2D;
padding-bottom: 12px;
font-size: 16px;
display: table;
margin: 0 auto;
margin-bottom: 15px;}
.lineup-box h3 a {color: #333;}
.lineup-box .products-explanation {
display: table;
color: #666;
margin-bottom: 15px;
font-size: 12px;}
.item-detail {border: 1px solid #ccc;
text-align: center;
padding: 8px 0px;
font-size: 12px;
color: #666;}
.item-detail a {color: #333;}
.goto-shopping-box {position: relative;}
.goto-shopping-box .arrow {position: absolute;
top: 50%;
  -webkit-transform: translateY(-50%); /* Safari */
  -ms-transform: translateY(-50%); /* IE 9 */
  transform: translateY(-50%);
right: -4px;}

.setbanner img {max-width: 100%;}

.original-goods .textbox-pc {padding-top: 30px;
padding-bottom: 45px;
padding-left: 40px;
padding-right: 40px;
color: #fff;}



/* ======================================================================================================================
◆会社案内ページ◆
====================================================================================================================== */

#company-page .sub-mainimg {margin-bottom: 60px;}

.top-message-wrap {overflow: hidden;}

.company-info,.company-map {margin-bottom: 80px;}
.info-company {overflow: hidden;
font-size: 14px;}
.info-company dl {padding-bottom: 12px;
margin-bottom: 12px;
border-bottom: 1px solid #ddd;}
.info-company dt {float: left;
width: 100%;
font-weight: normal;
font-weight: bold;
margin-bottom: 10px;}
.info-company dd {
width: 100%;
font-weight: normal;}

.map {height:360px;}
.message {width:100%;
display: block;
margin: 0 auto;}
.message h3 {margin-bottom: 40px;
line-height: 1.6;
font-size: 18px;
font-weight: bold;
}
.top-message-inner {overflow: hidden;
margin-bottom: 40px;}
.top-message-inner h3 {display: none;}
.top-message-inner:after {content: "";
    display: block;
    width: 100%;
    background: url(../img/bg/bg_top-message.jpg) no-repeat center center;
    background-size: cover;
    height: 280px;}

.p-sign {text-align: right;}
.p-sign img {max-width: 50%;}


/* ======================================================================================================================
◆取扱店紹介ページ◆
====================================================================================================================== */


.area-japan-detail {overflow-x:scroll;}

#shoplist-page .sub-mainimg {margin-bottom: 80px;}

#shoplist-page .titlebox-j {margin-bottom: 40px;}
#shoplist-page .titlebox-j h2 {margin-bottom: 20px;}

.area-list {border: 1px solid #ccc;
font-size:12px;
}

.area-list tbody {
  overflow-x: auto;
  white-space: nowrap;
}
.area-list tr {border: 1px solid #ccc;}
.area-list tr td {border: 1px solid #ccc;
vertical-align: middle;
padding: 12px;}

.gray {background-color: #fbfbfb;}

.sl-area01 {display: table;
margin: 0 auto;}

.sl-area {margin-bottom: 40px;}

.shoplist-area h3 {text-align: left;
font-size: 24px;
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
margin-bottom: 18px;
}

.shoplist-area {overflow-x:scroll;}


/* ======================================================================================================================
◆よくあるご質問ページ◆
====================================================================================================================== */


.faq-midashi {width: 100%;
background-color: #FFC914;
margin: 60px auto 60px;
}

.faq-midashi-inner {display: table;
margin: 0 auto;
overflow: hidden;
text-align: center;}


.faq-midashi ul {width: 100%;
overflow: hidden;
font-size: 14px;
padding: 8px 0px;
margin-bottom: 0;}

.faq-midashi ul li {text-align: left;
border-bottom: 1px solid #fff;
width: 100%;
padding: 8px 0px;
padding-left: 20px;}
.faq-midashi ul li:last-child {margin-right: 0px;
width: 100%;
border-bottom: none;}
.faq-midashi i {margin-right: 10px;}

.faq-block .faq-block-tit {text-align: center;}
.faq-block .faq-block-tit:after {content: "";
  width: 100px;
    border-bottom: 2px solid #962D2D;
    display: table;
    margin: 0 auto;
    padding-bottom: 30px;
    margin-bottom: 30px;
}

.faq-block .faq-block-tit h2 {font-size: 24px;
font-weight: bold;}

.faq-midashi-inner ul li a {color: #333;}

.faq-block .faq-block-tit {font-size: 28px;}

.faq-box {}

.faqbox-inner {padding-bottom: 40px;
margin-bottom: 40px;
border-bottom: 1px #ccc solid;}
.faqbox-inner:last-child {margin-bottom: 80px;}
.question {font-size: 16px;
margin-bottom: 4px;
color: #333;
overflow: hidden;}
.question dt {float: left;
display: inline-block;
width: 12%;}
.question dd {display: inline-block;
line-height: 42px;
font-weight: bold;
width: 84%;
float: right;}
.answer {margin-bottom: 0;}
.answer dd {padding-top: 9px;
display: inline-block;
}

.faq-q {background-color: #962D2D;
color: #fff;
width: 36px;
height: 36px;
margin-right: 20px;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 36px;
border-radius: 36px;
-webkit-border-radius: 36px;
-moz-border-radius: 36px;
}
.faq-a {margin-right: 20px;
background-color: #ccc;
color: #fff;
width: 36px;
height: 36px;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 36px;
border-radius: 36px;
-webkit-border-radius: 36px;
-moz-border-radius: 36px;
float: left;
}


.answer {overflow: hidden;}
.answer dt {float: left;
display: inline-block;
width: 12%;
}
.answer dd {float: right;
  display: inline-block;
  font-size: 14px;
width: 84%;}


/* ======================================================================================================================
◆お問い合わせページ◆
====================================================================================================================== */

#contents {width: 100%;
margin: 0;}


#contact-page .sub-mainimg {margin-bottom: 60px;}

.mailform {color: #666;
width: 100%;}

.contact-message p {display: table;
margin: 0 auto;
margin-bottom: 60px;}

/*ライン上タイトル*/
.contactform .c-tit {
  text-align: center;
  position: relative;
  margin-bottom: 20px;
}

.contactform .c-tit::before {
position: absolute;
    top: 50%;
    z-index: 1;
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: #666666;
    }

.contactform .c-tit .c-tit-inner {position: relative;
    z-index: 2;
    display: inline-block;
    margin: 0 2em;
    padding: 0 2em;
    background-color: #fff;}

.contactform .c-tit h3 {font-size: 18px;}

.attention {font-size: 12px;
color: #666;
margin-bottom: 20px;
margin-top: 40px;}

.contactform .mailform {width: 100%;
display: block;}

.mailform tbody {width: 100%;
display: block;}

.mailform tr {border-top: 1px dotted #666;
width: 100%;
display: table;}
.mailform tr:last-child {border-bottom: 1px dotted #666;}

.mailform th {padding: 20px 0px;
width: 100%;
font-weight: normal;
vertical-align: middle;
display: block;
font-weight: bold;}
.mailform th .hissu {margin-left: 10px;}
.mailform td {padding: 0px 0px 30px;
display: block;
width: 100%;}
.mwform-tel-field {width: auto;}
.mailform td .simple-box {
    width: 100%;
    border: solid 1px #f1efef;
    background: #f1efef;
    /*padding: 3px 10px;*/
    -webkit-transition: background 0.2s, border 0.2s;
    -moz-transition: background 0.2s, border 0.2s;
    -o-transition: background 0.2s, border 0.2s;
    transition: background 0.2s, border 0.2s;
    -webkit-appearance: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    outline-offset: -2px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
.mailform td .radioBtn {-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: solid 4px #f1efef;
    background: #f1efef;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align: -2px;
    -webkit-transition: background 0.15s;
    -moz-transition: background 0.15s;
    -o-transition: background 0.15s;
    transition: background 0.15s;
    margin: 0;
    margin-right: 8px;
  }

.mwform-radio-field {display: table;}
.horizontal-item {margin-left: 0px!important;}

.mwform-radio-field-text {margin-right: 12px;}

.goto-contact {
text-align: center;
    overflow: hidden;
    display: table;
    margin: 60px auto 0!important;
}


.yellow-btn {background-color: #FFC914;
width: 180px;
height: 60px;
line-height: 60px;
cursor: pointer;
border: none;
display: block;
text-decoration: none;
text-decoration: none;
float: right;
}
.gray-btn {background-color: #eee;
width: 120px;
height: 60px;
line-height: 60px;
cursor: pointer;
border: none;
display: block;
text-decoration: none;
float: left;}
.mw_wp_form_input .yellow-btn {background-color: #FFC914;
width: 240px;
height: 60px;
line-height: 60px;
cursor: pointer;
border: none;
display: block;
text-decoration: none;
margin: 0 auto!important;
}


.mw_wp_form {margin-top: 80px;}



/* ======================================================================================================================
◆マサジビールページ◆
====================================================================================================================== */

#masaji-beer-page .sub-mainimg {margin-bottom: 60px;}

.kanpai {margin-bottom: 60px;}

.kanpai h2 {display: table;
margin: 0 auto;
font-family: 'Mukta', sans-serif;
font-weight: bold;
font-size: 42px;
line-height: 1;
}

.kanpai img {text-align: center;
width: 180px;
height: auto;
margin: 20px auto 60px;
display: block;
}


.tit-h3 {
  text-align: center;
    font-size: 32px;
    letter-spacing: 0.4em;
    font-family: 'Mukta', sans-serif;
font-weight: bold;
}

.tit-h3:after {
  content: ""; 
width: 100px;
    border-bottom: 2px solid #962D2D;
    display: table;
    margin: 0 auto;
    padding-bottom: 30px;
    margin-bottom: 40px;
  }

.box-mb,.lineup-mb {margin-bottom: 60px;}

.lineup-mb-item .r-box h4 {margin-bottom: 10px;}

.box-mb {text-align: left;}


.tit-h4 {font-size: 14px;
font-weight: bold;
padding-bottom: 10px;
margin-bottom: 20px;
text-align: center;
color: #777;
}

.tit-h4:after {
  content: ""; 
	width: 10px;
    border-bottom: 1px solid #333;
    display: table;
    padding-bottom: 20px;
	margin: 0 auto;
	margin-bottom: 20px;
  }



.lineup-mb-item {overflow: hidden;
margin-bottom: 20px;}
.lineup-mb-item .l-box {float: left;
width: 80px;
margin-right: 20px;}
.lineup-mb-item .r-box {margin-top: 20px;}

.tomaker {color: #962D2D;
font-size: 80%;
}

.memories {margin-bottom: 40px;
text-align: left;}
.messeage-box {padding: 20px 15px;
border-top: 1px solid #999;
border-bottom: 1px solid #999;
margin-bottom: 20px;
margin-left: 15px;
margin-right: 15px;
}

.name {text-align: right;
margin-top: 10px;}



.message-to-masaji h3 {text-align: center;
margin-bottom: 40px;}

.message-to-masaji {margin-bottom: 80px;}

.lineup-context {margin-bottom: 60px;
text-align: center;}

.masaji-beer-list {margin: 40px 0;
display: table;}

.masaji-beer-list li {width: 100%;
	font-size: 14px;
}

.daihyou {text-align: right;
margin-top: 0px;
margin-bottom: 30px;}

.lineup-context {display: none;}

.on-pc {display: none;}

.lineup-mb-item .l-box img {max-width: 100%;}

.voice img {width: 60px;
height: 60px;
}


.lineup-mb-item h4 {font-weight: bold;}


.lineup-mb .tit-box h5 {background-color: #000;
color: #fff;
text-align: center;
padding: 8px 0px;
margin-bottom: 20px;}


.godfather6 {width: 200px;
margin: 0px 0px 40px;
text-align: center;
display: table;}

.shinonde {background: url(../img/bg/syacho.jpg) no-repeat center center;
  background-size:cover;
height: 240px;
margin-bottom: 40px;}


.godfather-wrap {text-align: center;
margin: 0 auto;
display: table;}


/* ======================================================================================================================
◆イベントページ◆
====================================================================================================================== */

#event-page .sub-mainimg {margin-bottom: 120px;}
#calendar tr {margin-bottom: 18px;
  padding-bottom: 18px;
border-bottom: 1px solid #ccc;}

#calendar tr td {display: table;}

.event-information .titbox-events {text-align: center;
margin-bottom: 40px;}
.event-information .titbox-events h3 {margin-bottom: 20px;}

.event-year .monthbox {overflow: hidden;
width: 100%;
padding-bottom: 30px;
margin-bottom: 30px;
border-bottom: 1px solid #ccc;
}

.event-year .monthbox .month {
display: table;
text-align: center;
margin: 0 auto;
}

.month-wrap {width: 60px;
height: 60px;
background-color: #fdd108;
border-radius: 30px;        /* CSS3草案 */  
-webkit-border-radius: 30px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 30px;   /* Firefox用 */
line-height: 60px;
text-align: center;
margin-bottom: 30px;
}

.event-year .monthbox .eventbox {float: left;
display: inline-block;
width: 100%;
vertical-align: middle;
}
.event-year .monthbox .eventbox .eventset {overflow: hidden;
  width: 100%;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px dotted #ccc;
}
.event-year .monthbox .eventbox .eventset:last-child {border:none;
margin-bottom: 0;}
.event-year .monthbox .eventbox .eventday {display: table;
  float: left;
  margin-right: 20px;
  margin-top: 2px;
}
.event-year .monthbox .eventbox .eventplace {
  display: table;
  background-color: #000;
  font-size: 11px;
  color: #fff;
  padding: 4px 12px;
}
.event-year .monthbox .eventbox .eventname {width: 100%;
  margin-top: 8px;
  overflow: hidden;
  font-size: 18px;
}

  .next-prev-box {margin-top: 40px;}

  .next-prev {display: table;
    text-align: center;
    padding: 8px 18px;
    border: #cecece;
    background-color: #000;
    color: #fff;
    margin: 40px auto 0;}

    .next-prev p {margin: 0;}
    .next-prev a {color: #fff;}


/* ======================================================================================================================
◆頒布会ページ◆
====================================================================================================================== */

#hanpukai-page .sub-mainimg {margin-bottom: 40px;}

.about-hanpukai {padding: 0 15px;
margin-bottom: 40px;}

.about-hanpukai h3 {margin-bottom: 40px;
border-bottom: 3px solid rgb(228, 191, 101);
font-size: 20px;
padding: 0 15px 4px;
position: relative;}

.about-hanpukai h3::before {
    left: 0px;
    bottom: 24px;
    transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    content: "";
    position: absolute;
    width: 2px;
    height: 36px;
    background-color: #221815;
}

.about-hanpukai h3::after {
    right: 0px;
    bottom: 24px;
    transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    content: "";
    position: absolute;
    width: 2px;
    height: 36px;
    background-color: #221815;
}

.hanpukai-sub-sp {margin-bottom: 40px;}

.hanpukai-title {padding: 0 15px;
text-align: center;
margin-bottom: 40px;}

.hanpukai-title h3 {padding: 16px 24px;
    border: 5px solid #E4BF65;
    display: inline-block;
    margin: 0 auto 20px;
    box-shadow: 5px 5px 5px #ccc;
    font-size: 20px;
    text-align: center;}

    .naiyou_nakami {text-align: center;
    color: #E4535E;
    font-size: 20px;
    font-weight: bold;
    display: inline-block;
    background: linear-gradient(transparent 50%, yellow 50%);
    margin: 0 auto;}

  .img-max img {max-width: 100%;}


.hanpukai-box {margin-bottom: 30px;}

.hanpukai-box h4 {background-color: #E4535E;
    width: 60px;
    height: 60px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;}

    .hanpukai-box h4:before {content: "";
    position: absolute;
    bottom: -18px;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top: 10px solid #E4535E;
    z-index: 0;}

  .set-box th {padding: 0px 20px;
    text-align: center;
    vertical-align: middle;
    background-color: #E4BF65;
    font-weight: normal;}

  .set-box td {
    padding: 0px 6px;
    background-color: #fefefe;
}

    .teiban {font-size: 75%;
    color: #fff;
    background-color: #000;
    padding: 4px 8px;
    margin-right: 8px;
    border-radius: 3px;}

.limited {
    background-color: #E4535E;
    color: #fff;
    font-size: 75%;
    padding: 4px 8px;
    margin-right: 8px;
    border-radius: 3px;
}

.hanpukai-attention {padding: 0 15px;
font-size: 12px;
margin-bottom: 40px;}


.limited-beer {overflow: hidden;}

.limited-beer img {margin-top: 360px;
z-index: -222;}

.limited-inbox {
  margin: 0 15px;
    background-color: #E4535E;
    padding: 60px 30px 30px 30px;
    position: absolute;
    top: 45px;
    left: 0px;
    z-index: -111;
    color: #fff;
}

.limited-box h4 {
    background-color: #E4535E;
    width: 90px;
    height: 90px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    border-radius: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 5px solid #fff;
    font-size: 16px;
}

.limited-beer .s-beer-list li {
    width: 100%;
}

.s-beer-list {overflow: hidden;}

.course-box {
    border: 3px solid #ccc;
    box-shadow: 2px 2px 2px #ccc;
    padding: 20px;
}

.course-box .two-course {
    background-color: #E4535E;
    width: 90px;
    height: 90px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    border-radius: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin: 0 auto;
    font-weight: bold;
    line-height: 1.2;
}

.course-box h4 {
    text-align: center;
    font-size: 20px;
    margin-top: 20px;
}

.course-box h5 {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

.course-box h6 {
    text-align: center;
    font-size: 15px;
}

.buy-hunpukai {
    padding: 12px 24px;
    color: #fff;
    background-color: #000;
    display: inline-block;
    box-shadow: 2px 2px 2px #ccc;
}

.buy-hunpukai {
    padding: 12px 24px;
    color: #fff;
    background-color: #000;
    display: table;
    box-shadow: 2px 2px 2px #ccc;
    text-align: center;
    margin: 0 auto;
}

.course-block {margin-bottom: 60px;}

.course-box {margin-bottom: 30px;}

.way-box {
    margin-bottom: 40px;
}
.way-box:last-child {margin-bottom: 0;}

.way-box h4 {
    padding-bottom: 10px;
    border-bottom: 1px solid #999;
    margin-bottom: 20px;
    text-align: center;
}

.hanpukai-sub {display: none;}

.hanpukai-shopping a {color: #ccc;
text-align: center;}

.course-box {font-size: 18px;}

.course-box h4:after {
  content: "";
    width: 100px;
    display: table;
    border-bottom: 2px solid #ccc;
    margin: 0 auto;
    padding-top: 20px;
    margin-bottom: 20px;
}

.course-box h5 {font-size: 16px;}
.course-box h6 {margin-bottom: 40px;}

.example-month {
    margin-top: 15px;
    background-color: #efefef;
    padding: 15px;
}

.tyousei {margin-bottom: 8px;
}

.mt20 {margin-top: 20px;}


  /* ======================================================================================================================
◆2018感謝祭ページ◆
====================================================================================================================== */

#ttt-page .sub-mainimg {margin-bottom: 100px;}

.ttt-info .tit-h2 {line-height: 1.4;}

.ttt-access li {width: 100%;
margin-bottom: 12px;}

.place {margin-bottom: 40px;
margin-top: 40px;}
.ttt-b {font-weight: bold;}
.ttt-date {text-align: center;
font-family: "Roboto Slab", Garamond, "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, HGS明朝E, "ＭＳ Ｐ明朝", "MS PMincho", serif;}

#ttt-page .tit-under {margin-bottom: 40px;}

.ttt-date {margin-bottom: 80px;}

.ttt-date-big {font-size:42px;}
.ttt-date-small {font-size:20px;
padding-right: 10px;}
.ttt-date-small-en {font-size:28px;
padding-right: 10px;
padding-bottom: 10px;}
.ttt-date-big-jp {font-size:28px;}
.ttt-date-small-jp {font-size:20px;}

.maeuri {margin-bottom: 40px;
overflow: hidden;}

.toujitsu {margin-bottom: 60px;
overflow: hidden;}

.box-maeuri {margin-bottom: 20px;}

.tit-maeuri,.tit-toujitsu {text-align: center;
margin-bottom: 20px;}
.tit-maeuri h3,.tit-toujitsu h3 {font-weight: 500;
font-size: 22px;}
.box-border {text-align: center;
  padding: 20px 20px;
  border: 1px #333 solid;
  display: table;
  margin: 0 auto;
  font-weight: 600;
}

.novelty {margin-bottom: 40px;}

.tit-novelty h3 {font-size: 14px;
font-size: 400;
border:1px solid #333;
padding: 10px 20px;
background-color: #000;
color: #fff;
display: table;
text-align: center;
margin: 0 auto 20px;}

.box-border02 {text-align: center;
  padding: 20px 20px;
  border: 1px #333 solid;
  margin: 0 auto;
  font-weight: 600;
}

.txt-maeuri,.txt-toujitsu {font-size: 90%;
width: 100%;
margin: 0 auto;}
.txt-maeuri li,.txt-toujitsu li {width: 100%;}

.ticket-attention {border: 1px solid red;
}

.attention-box {color: red;
  font-size: 90%;
  padding: 20px;
  overflow: hidden;
}
.attention-box h3 {font-size: 18px;
text-align: center;
margin-bottom: 20px;}

.ticket {margin-bottom: 120px;}

.event-access {margin-bottom: 40px;}

.access-point {font-size: 90%;
background-color: #eee;
padding: 30px;
margin: 0;}

.access-point p {margin: 0;}

.info-ttt-box {
overflow: hidden;
width: 100%;
margin: 0 auto 40px;}

.info-ttt-box:last-child {margin-bottom: 0;}

.info-ttt-box h3,.warehouse-ttt-box h3 {text-align: center;
font-size: 18px;
padding: 10px 0;
border-top:1px solid #999;
border-bottom:1px solid #999;
margin-bottom: 30px;
}

.info-ttt-box li {line-height: 2;}

.info-ttt {margin-bottom: 100px;}

.ttt-img img {max-width: 100%;}

.warehousebox {margin-bottom: 40px;}

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

.ttt-access {overflow: hidden;
margin-bottom: 40px;}

.item {overflow: hidden;}

.item h4 {background-color: #000;
padding: 10px;
text-align: center;
color: #fff;
font-size: 12px;
margin-bottom: 20px;}

.item li {width: 100%;}

#ttt-page .tit-under {width: 100px;
border-bottom: 2px solid #962D2D;
display: table;
margin: 20px auto 0;
margin-bottom: 60px;
}

.uchikeshi {text-decoration:line-through;}

.aisatsu {text-align: center;
}

.txt-maeuri {overflow: hidden;
margin-bottom: 60px;}

.ticket-hanbai {overflow: hidden;}

.yahoo {text-align: center;
background-color: #fdd108;
padding: 10px 0;
margin-bottom: 20px;}
.yahoo a {color: #333;}
.hanbai-space {padding: 24px 36px;
border: 1px #ccc solid;}
.realshop {font-weight: bold;}

.greating-ttp {margin-bottom: 80px;
padding: 0 15px;}

.foodbox {margin-bottom: 24px;}

.foodbox img {max-width: 100%;
margin-bottom: 12px;}

.foodbox h4 {font-size: 16px;
font-weight: bold;
margin-bottom: 8px;}

.foodbox h4 a {color: #333;
text-decoration:underline;}

.food-tit {margin-bottom: 20px;}
.food-tit h3 {text-align: center;
font-size: 22px;}

.provide {line-height: 1.4;
font-size: 13px;}

.people h4 {font-size: 16px;
    font-size: 400;
    padding: 10px 20px;
    background-color: #000;
    color: #fff;
    display: table;
    text-align: center;
    margin: 0 auto 40px;}

.people .sat {color:#0600ff;
padding-bottom: 18px;
display: table;
border-bottom:#0600ff 2px solid;
text-align: center;
margin: 0 auto 30px;}
.people .sun {color:#ff0000;
padding-bottom: 18px;
display: table;
border-bottom:#ff0000 2px solid;
text-align: center;
margin: 40px auto 30px;}
.people h5 {
  font-size: 18px;
}
.people dt {margin-bottom: 10px;
padding-bottom: 8px;
border-bottom: 1px solid #333;
display: table;}
.timetable {text-align: center;}
.timetable th {padding-left: 20px;}
.mb10 {margin-bottom: 10px;
text-align: left;
font-weight: 700;
padding-bottom: 8px;
border-bottom: 1px solid #333;
display: table;}

.foodshop {margin-bottom: 80px;}

.finish {text-align: center;
margin-top: 30px;}

.ecoeco {background-color: #eee;
padding: 20px;}

.covojean {margin-left: 20px;
font-size: 75%;
color: red;}

/*動画*/
.blog-sentence iframe {max-width: 100%;}

}
