.cf:before,.cf:after
{
content:"";
display:table
}

.cf:after
{
clear:both
}

.cf
{
*zoom:1
}

html,body
{
width:100%;
height:100%
}

.js .pending-float
{
visibility:hidden
}

.js .pending-impact
{
visibility:hidden
}

.js #suntory_contents
{
visibility:visible
}

.cssanimations .attention
{
-webkit-animation:attention-anim 2s ease-in-out infinite alternate;
-moz-animation:attention-anim 2s ease-in-out infinite alternate;
animation:attention-anim 2s ease-in-out infinite alternate
}

@-webkit-keyframes attention-anim
{
0%
{
-webkit-transform:translate(0px, 0px)
}

85%
{
-webkit-transform:translate(0px, 0px)
}

100%
{
-webkit-transform:translate(0px, -15px)
}


}

@-moz-keyframes attention-anim
{
0%
{
-moz-transform:translate(0px, 0px)
}

85%
{
-moz-transform:translate(0px, 0px)
}

100%
{
-moz-transform:translate(0px, -15px)
}


}

@keyframes attention-anim
{
0%
{
transform:translate(0px, 0px)
}

85%
{
transform:translate(0px, 0px)
}

100%
{
transform:translate(0px, -15px)
}


}

@media screen and (min-width: 769px)
{
body
{
min-width:960px;
overflow-y:scroll
}

.js .pending
{
visibility:hidden
}

#mw
{
display:none;
position:relative;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
z-index:100
}

#mw .container
{
display:table-cell;
padding:20px 0;
vertical-align:middle;
text-align:right
}

#mw .container .wrapper
{
width:80%;
max-width:960px;
margin:0 auto
}

#mw .container .wrapper .btn-close
{
width:41px;
margin-right:0;
margin-left:auto
}

#mw .container .wrapper .yt
{
position:relative;
width:100%;
margin-top:20px;
padding-bottom:56.25%;
background-color:#000
}

#mw .container .wrapper .yt iframe
{
position:absolute;
top:0;
left:0;
width:100%;
height:100%
}

#mw .container .wrapper .image
{
position:relative;
width:100%;
margin-top:20px
}

#mw .container .wrapper .image img
{
width:100%;
height:auto
}

#mw .container .wrapper.ver
{
max-width:450px
}

#mw .container .wrapper.hor
{
max-width:960px
}

#suntory_contents img
{
position:relative
}

#suntory_contents p
{
margin:0
}

#suntory_contents main
{
display:block;
position:relative;
line-height:0;
overflow:hidden
}

#suntory_contents #contents-wrapper
{
position:relative;
max-width:1200px;
margin:0 auto
}

#suntory_contents #gheader
{
position:relative;
left:50%;
width:960px;
margin-left:-480px;
padding-top:10px;
padding-bottom:10px
}

#suntory_contents #gheader .menu
{
float:left;
position:relative
}

#suntory_contents #gheader .menu>ul>li
{
float:left;
position:relative;
margin:8px 39px 0
}

#suntory_contents #gheader .menu>ul>li a
{
display:block
}

#suntory_contents #gheader .menu>ul>li:first-child
{
margin:8px 48px 0 0
}

#suntory_contents #gheader .menu>ul li.product
{
position:relative;
margin:8px 39px 0;
z-index:1
}

#suntory_contents #gheader .menu>ul li.product a
{
position:relative;
z-index:1
}

#suntory_contents #gheader .menu>ul li.product .submenu
{
display:none;
position:absolute;
top:42px;
left:-55px;
padding-top:22px
}

#suntory_contents #gheader .menu>ul li.product .submenu ul
{
width:202px;
height:202px;
padding-top:1px;
background:url(../images/pc/common/header_menu2_sub_bg.png) no-repeat;
box-sizing:border-box
}

#suntory_contents #gheader .menu>ul li.product .submenu ul li
{
margin-top:2px;
margin-left:1px
}

#suntory_contents #gheader .menu>ul li.product .submenu ul li:first-child
{
margin-top:0
}

#suntory_contents #gheader .menu>ul li.graphic
{
margin-right:0
}

#suntory_contents #gheader .menu>ul .line
{
float:left;
margin:0
}

#suntory_contents #gheader .menu .underline
{
margin-top:10px
}

#suntory_contents #gheader .btn-facebook
{
float:right;
position:relative;
margin-top:6px;
z-index:1
}

#suntory_contents #gheader .btn-menu
{
display:none
}

#suntory_contents #contents
{
position:relative;
left:50%;
width:960px;
margin-left:-480px;
padding-bottom:20px
}

#suntory_contents #contents .btn-pagetop
{
margin-top:115px;
text-align:center
}

#suntory_contents #contents .btn-pagetop a
{
display:inline-block
}

#suntory_contents #contents .btn-pagetop a .rainbow img
{
width:82px;
height:26px
}

#suntory_contents #contents .btn-pagetop a .text
{
margin-top:10px
}

#suntory_contents #contents nav.sp
{
display:none
}

#suntory_contents #contents .note
{
display:block;
position:relative;
margin-top:93px;
color:#fff;
font-size:10px;
line-height:1.4;
z-index:1
}

#suntory_contents .sns
{
position:relative;
max-width:960px;
margin:0 auto;
padding:10px 0;
background-color:#fff;
z-index:10
}

#suntory_contents .sns .socialbutton_suntory
{
width:auto !important;
height:auto !important
}

#suntory_contents .sns .socialbutton_suntory_socialbuttons
{
height:auto !important
}

#suntory_contents .sns .socialbutton_suntory_socialbutton
{
padding:0 !important
}


}

@media screen and (max-width: 768px)
{
body
{
overflow-y:scroll
}

#mw
{
display:none;
position:relative;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
z-index:100
}

#mw .container
{
display:table-cell;
padding:20px 0;
vertical-align:middle;
text-align:right
}

#mw .container .wrapper
{
width:90%;
max-width:960px;
margin:0 auto
}

#mw .container .wrapper .btn-close
{
width:5%;
margin-right:0;
margin-left:auto
}

#mw .container .wrapper .btn-close img
{
width:100%;
height:auto
}

#mw .container .wrapper .yt
{
position:relative;
width:100%;
margin-top:2.08333%;
padding-bottom:56.25%;
background-color:#000
}

#mw .container .wrapper .yt iframe
{
position:absolute;
top:0;
left:0;
width:100%;
height:100%
}

#mw .container .wrapper .image
{
position:relative;
width:100%;
margin-top:2.08333%
}

#mw .container .wrapper .image img
{
width:100%;
height:auto
}

#mw .container .wrapper.ver
{
max-width:450px
}

#mw .container .wrapper.hor
{
max-width:960px
}

#suntory_contents img
{
position:relative
}

#suntory_contents p
{
margin:0
}

#suntory_contents main
{
display:block;
position:relative;
line-height:0;
overflow:hidden
}

#suntory_contents #wcontents-wrapper
{
position:relative;
max-width:640px;
margin:0 auto
}

#suntory_contents #gheader
{
position:relative;
width:93.75%;
margin:0 auto;
margin-top:3.90625%
}

#suntory_contents #gheader .menu
{
position:relative
}

#suntory_contents #gheader .menu ul .logo
{
width:31.83333%
}

#suntory_contents #gheader .menu ul .logo img
{
width:100%;
height:auto
}

#suntory_contents #gheader .menu ul .news,#suntory_contents #gheader .menu ul .product,#suntory_contents #gheader .menu ul .cm,#suntory_contents #gheader .menu ul .graphic,#suntory_contents #gheader .menu ul .line
{
display:none
}

#suntory_contents #gheader .menu .underline
{
margin-top:3.33333%;
width:100.16667%
}

#suntory_contents #gheader .menu .underline img
{
width:100%;
height:auto
}

#suntory_contents #gheader .btn-facebook
{
position:absolute;
top:0;
right:15%;
margin-top:0.16667%;
width:36.66667%
}

#suntory_contents #gheader .btn-facebook img
{
width:100%;
height:auto
}

#suntory_contents #gheader .btn-menu
{
position:absolute;
top:0;
right:3.33333%;
margin-top:0.16667%;
width:7.16667%
}

#suntory_contents #gheader .btn-menu img
{
width:100%;
height:auto
}

#suntory_contents #contents
{
position:relative;
padding-bottom:3.125%
}

#suntory_contents #contents .btn-pagetop
{
margin-top:17.96875%;
text-align:center
}

#suntory_contents #contents .btn-pagetop a
{
display:block;
width:19.375%;
margin:0 auto
}

#suntory_contents #contents .btn-pagetop a .rainbow
{
width:96.77419%
}

#suntory_contents #contents .btn-pagetop a .rainbow img
{
width:100%;
height:auto
}

#suntory_contents #contents .btn-pagetop a .arrow
{
margin:0 auto;
width:37.90323%
}

#suntory_contents #contents .btn-pagetop a .arrow img
{
width:100%;
height:auto
}

#suntory_contents #contents .btn-pagetop a .balls
{
position:relative;
width:54.03226%;
margin:0 auto;
padding-bottom:78.22581%
}

#suntory_contents #contents .btn-pagetop a .balls li
{
position:absolute
}

#suntory_contents #contents .btn-pagetop a .balls li img
{
width:100%;
height:auto
}

#suntory_contents #contents .btn-pagetop a .balls .ball1
{
top:0;
left:25.37313%;
width:35.8209%
}

#suntory_contents #contents .btn-pagetop a .balls .ball2
{
top:53.60825%;
left:0;
width:58.20896%
}

#suntory_contents #contents .btn-pagetop a .balls .ball3
{
top:39.17526%;
right:0;
width:49.25373%
}

#suntory_contents #contents .btn-pagetop a .text
{
margin-top:8.06452%;
width:100%
}

#suntory_contents #contents .btn-pagetop a .text img
{
width:100%;
height:auto
}

#suntory_contents #contents nav.sp
{
position:relative;
width:84.53125%;
margin:0 auto;
margin-top:3.125%;
padding-top:9.21875%;
z-index:1
}

#suntory_contents #contents nav.sp h5
{
margin:0 auto;
width:12.56932%
}

#suntory_contents #contents nav.sp h5 img
{
width:100%;
height:auto
}

#suntory_contents #contents nav.sp>ul
{
margin-top:4.80591%
}

#suntory_contents #contents nav.sp>ul>li img
{
width:100%;
height:auto
}

#suntory_contents #contents nav.sp>ul>li>a
{
display:block;
padding:5.91497% 0
}

#suntory_contents #contents nav.sp>ul .menu1 img
{
width:12.01479%;
height:auto;
max-height:31px;
margin-left:4.06654%
}

#suntory_contents #contents nav.sp>ul .menu2 img
{
width:41.95933%;
height:auto;
max-height:31px;
margin-left:4.06654%
}

#suntory_contents #contents nav.sp>ul .menu3
{
position:relative;
z-index:1
}

#suntory_contents #contents nav.sp>ul .menu3>a
{
padding:5.91497% 0 2.95749%
}

#suntory_contents #contents nav.sp>ul .menu3>a img
{
width:54.15896%;
height:auto;
max-height:31px;
margin-left:4.06654%
}

#suntory_contents #contents nav.sp>ul .menu3 .submenu
{
position:relative;
width:99.44547%;
margin-bottom:4.43623%;
padding-bottom:59.33457%
}

#suntory_contents #contents nav.sp>ul .menu3 .submenu ul
{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
padding:0.74349% 0;
background:url(../images/sp/common/footer_menu3_sub_bg.png) no-repeat;
background-size:100% 100%;
box-sizing:border-box;
line-height:0
}

#suntory_contents #contents nav.sp>ul .menu3 .submenu ul li
{
margin:0 auto;
margin-top:0.92937%;
width:98.88476%
}

#suntory_contents #contents nav.sp>ul .menu3 .submenu ul li img
{
width:100%;
height:auto
}

#suntory_contents #contents nav.sp>ul .menu3 .submenu ul li:first-child
{
margin-top:0
}

#suntory_contents #contents nav.sp>ul .menu4 img
{
width:61.73752%;
height:auto;
max-height:69px;
margin-left:4.06654%
}

#suntory_contents #contents nav.sp>ul .menu5 img
{
width:91.86691%;
height:auto;
max-height:31px;
margin-left:4.06654%
}

#suntory_contents #contents .note
{
display:block;
position:relative;
width:93.75%;
margin:0 auto;
margin-top:12.34375%;
padding:0 3.125%;
color:#fff;
font-size:0.75em;
line-height:1.6;
z-index:1
}

#suntory_contents .sns
{
position:relative;
width:93.75%;
margin:0 auto;
padding:10px 0;
z-index:10
}

#suntory_contents .sns .socialbutton_suntory
{
width:auto !important;
height:auto !important
}

#suntory_contents .sns .socialbutton_suntory_socialbuttons
{
height:auto !important
}

#suntory_contents .sns .socialbutton_suntory_socialbutton
{
padding:0 !important
}


}


