@charset "utf-8";

#suntoryCommonWrapper{min-width:1160px;}

/* ========================================================================
.pc_none
========================================================================= */
#sungoliathCommonHeader .pc_none,
#sungoliathCommonFooter .pc_none,
#sungoliath_contents .pc_none{
display:none;
}

/* ========================================================================
#sungoliathCommonHeader
========================================================================= */
#sungoliathCommonHeader{
background:#000;
text-align:center;
}
/* #sungoliathCommonHeader header#sungoliathCommonHd
================================================================ */
#sungoliathCommonHd{
width:1160px;
margin:0 auto;
padding:10px 0 20px;
text-align:left;
position:relative;
}
#sungoliathCommonHd:after{content:""; clear:both; display:block;}
#sungoliathCommonHd h1{float:left;}
#sungoliathCommonHd nav{float:right;width:905px;}

/* #sungoliathCommonHd h1
-------------------------------------------------- */
#sungoliathCommonHd h1{
display:block;

}
#sungoliathCommonHd h1 a{
display:block;text-indent:100%;white-space:nowrap;overflow:hidden;line-height:0;
margin:0;
background:url(../img/logo_sungoliath.png) no-repeat 0 center;
background-size:230px auto;
width:255px;
height:75px;
position:absolute;
top: 13px;
left:0;
}
#sungoliathCommonHd h1 a.hover{
opacity:0.8;filter:alpha(opacity=80);-ms-filter:"alpha(opacity=80)";
}

/* #sungoliathCommonHd .menu_extra
-------------------------------------------------- */
#sungoliathCommonHd .menu_extra{
    margin:0 6px 0 auto;
    width:auto;
    display:flex;
    justify-content: flex-end;
}
#sungoliathCommonHd .menu_extra #btn_english {
    margin-right:20px;
    font-size:13px;
    line-height: 18px;
    font-weight:bold;
}
#sungoliathCommonHd #btn_english a{
    color:#fff;
}
#sungoliathCommonHd #btn_english a:hover{
    color: #ffbb00;
}

#sungoliathCommonHd .menu_extra .btn_goods {
    height:18px;
    border-left:1px #333 solid;
    padding:0 20px;
}
#sungoliathCommonHd .menu_extra .btn_goods a {
    color: #fff;
    font-size:12px;
    line-height: 18px;
    background:url(../img/icon_cart.svg) no-repeat 0 center;
    background-size:auto 18px;
    padding-left:28px;
}
#sungoliathCommonHd .menu_extra .btn_goods a:hover {
    color: #ffbb00;
    background:url(../img/icon_cart_yellow.svg) no-repeat 0 center;
    background-size:auto 18px;
}
#sungoliathCommonHd .menu_extra .btn_fanclub {
    height:18px;
    border-right:1px #333 solid;
    border-left:1px #333 solid;
    padding:0 20px;
    margin-right:20px;
}
#sungoliathCommonHd .menu_extra .btn_fanclub a {
    color: #fff;
    font-size:12px;
    line-height: 18px;
    background:url(../img/icon_member.svg) no-repeat 0 center;
    background-size:14px auto;
    padding-left:25px;
}
#sungoliathCommonHd .menu_extra .btn_fanclub a:hover {
    color: #ffbb00;
    background:url(../img/icon_member_yellow.svg) no-repeat 0 center;
    background-size:14px auto;
}

#sungoliathCommonHd .menu_extra .btn_sns {
    display:flex;
}
#sungoliathCommonHd .menu_extra .btn_sns li a {
    width:20px;
    height:20px;
    background:#eee;
    text-indent: -99999px;
    display:block;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_facebook {
    margin-right:20px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_facebook a {
    width:19px;
    height:18px;
    background:url(../img/icon_facebook.svg) no-repeat center center;
    background-size:auto 17px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_facebook a:hover {
    background:url(../img/icon_facebook_yellow.svg) no-repeat center center;
    background-size:auto 17px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_twitter {
    margin-right:20px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_twitter a {
    width:18px;
    height:18px;
    background:url(../img/icon_x.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_twitter a:hover {
    background:url(../img/icon_x_yellow.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_instagram {
    margin-right:20px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_instagram a {
    width:18px;
    height:18px;
    background:url(../img/icon_instagram.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_instagram a:hover {
    background:url(../img/icon_instagram_yellow.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_youtube {
    margin-right:20px;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_youtube a {
    width:18px;
    height:18px;
    background:url(../img/icon_youtube.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_youtube a:hover {
    background:url(../img/icon_youtube_yellow.svg) no-repeat center center;
    background-size:18px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_line a {
    width:21px;
    height:21px;
    background:url(../img/icon_line.svg) no-repeat center center;
    background-size:21px auto;
}
#sungoliathCommonHd .menu_extra .btn_sns li.btn_line a:hover {
    background:url(../img/icon_line_yellow.svg) no-repeat center center;
    background-size:21px auto;
}

/* #sungoliathCommonHd nav ul
-------------------------------------------------- */
#sungoliathCommonHd nav ul{
margin:10px 0 0 auto;
width:835px;
display:flex;
justify-content: space-between;
}
#sungoliathCommonHd nav>ul>li{
position:relative;
}
#sungoliathCommonHd nav>ul>li:first-child:before{
left:0;
}
#sungoliathCommonHd nav>ul>li>a{
display:block;
width:100%;
height:30px;
display:flex;
align-items: center;
transition:all 0.22s;
text-align:center;
}
#sungoliathCommonHd na ul li:hover a {
    color: #ffbb00;
}
#sungoliathCommonHd nav>ul>li>a>i{
display:none;
}
#sungoliathCommonHd nav>ul>li>a>em{
color:#fff;
font-size:14px;
font-weight:500;
letter-spacing:-1px;
}
#sungoliathCommonHd nav>ul>li:hover >a em {
    color: #ffbb00;
}
#sungoliathCommonHd nav ul li .sub_menu {
    width:180px;
    background: #fff;
    position: absolute;
    top: 40px;
    left: calc(50% - 90px);
    z-index: 1000;
    /* box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4); */
    /*drop-shadow(0 0 10px rgba(0, 0, 0, .4));*/
    /* display: none; */
    opacity:0;
    z-index:-1;
    transition: all .5s;
}
#sungoliathCommonHd nav ul li .sub_menu.active {
    /* display: block; */
    z-index:1000;
    opacity:1;
}

#sungoliathCommonHd nav ul li .sub_menu::before {
    content: '';
    width:20px;
    height:10px;
    background:url(../img/hook_sub_menu.png) no-repeat 0 0;
    background-size:20px 10px;
    position:absolute;
    top:-10px;
    left:calc(50% - 10px);
}

#sungoliathCommonHd nav ul li .sub_menu p {
    font-size: 14px; 
    font-weight: bold;
}
#sungoliathCommonHd nav ul li .sub_menu p a {
    display:block;
    text-align: center;
    padding:35px 0;
    color: #000;
    font-weight: bold;
    line-height: 1.4;
    position: relative;
}
#sungoliathCommonHd nav ul li .sub_menu p a:hover {
    background:#f6e6cc;
}
#sungoliathCommonHd nav ul li .sub_menu p a:hover::before {
    content: '';
    width:180px;
    height:1px;
    background:#f6e6cc;
    position: absolute;
    bottom:-1px;
    left:0;
}
#sungoliathCommonHd nav ul li .sub_menu p a::after {
    content:'';
    width: 120px;
    height:1px;
    background:#f6e6cc;
    position: absolute;
    top:0;
    left:calc(50% - 60px);
}
#sungoliathCommonHd nav ul li .sub_menu p:first-child a::after {
    display: none;
}
#sungoliathCommonHd nav ul li .sub_menu p:first-child a:hover::before {
    display: none;
}

/* ========================================================================
#sungoliathCommonFooter
========================================================================= */
#sungoliathCommonFooter{
text-align:center;
position: relative;
}
/* #sungoliathCommonFooter .page_top
================================================================================================= */
#sungoliathCommonFooter .page_top{
float:right;
margin-top:-52px;
}
#sungoliathCommonFooter .page_top.fixed{
position:fixed;
bottom:0;
right:0;
z-index:500;
}
#sungoliathCommonFooter .page_top i{
display:block;text-indent:100%;white-space:nowrap;overflow:hidden;line-height:0;
cursor:pointer;
width:118px;
height:118px;
background:url(../img/page_top.png) no-repeat 0 0
}
#sungoliathCommonFooter .page_top i.hover{
background:url(../img/page_top_on.png) no-repeat 0 0;
}
/* #sungoliathCommonFooter h1
-------------------------------------------------- */
#sungoliathCommonFooter h1{
display:block;
/*background:linear-gradient(#fff 50%,#000 50%,#000);*/
/*padding-top:10px;*/
}
#sungoliathCommonFooter h1 a{
display:block;text-indent:100%;white-space:nowrap;overflow:hidden;line-height:0;
margin:0 auto;
width:170px;
height:130px;
background:url(../img/logo.png) no-repeat 0 0;
background-size:170px auto;
position: absolute;
top: -68px;
left: calc(50% - 85px);
}
/*
#sungoliathCommonFooter h1 a.hover{
opacity:0.9;filter:alpha(opacity=90);-ms-filter:"alpha(opacity=90)";
}
*/
/* #sungoliathCommonFooter footer#sungoliathCommonFt
================================================================ */
#sungoliathCommonFt{
background:#000;
}
#sungoliathCommonFt section{
width:1160px;
margin:0 auto;
text-align:left;
}
/* #sungoliathCommonFt #sungoliathCommonFt_01
-------------------------------------------------- */
#sungoliathCommonFt_01{
padding:88px 0 18px;
}
#sungoliathCommonFt_01 nav ul{
display:table;
width:100%;
}
#sungoliathCommonFt_01 nav>ul>li{
display:table-cell;
vertical-align:top;
text-align:left;
width:140px;
}
#sungoliathCommonFt_01 nav>ul>li.member {
    width:210px;
}
#sungoliathCommonFt_01 nav>ul>li:last-child {
    width:110px;
}
#sungoliathCommonFt_01 nav>ul>li>dl{
width:110px;
margin:0;
text-align:center;
}
#sungoliathCommonFt_01 nav>ul>li.member>dl {
    width: 180px;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dt{
padding-bottom:30px;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dt>a{
display:block;
width:110px;
height:82px;
margin:0 auto;
border-bottom:1px solid #333;
transition:all 0.22s;
}
#sungoliathCommonFt_01 nav>ul>li.member>dl>dt>a {
    width: 180px;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dt>a>i{
display:block;
padding:20px 0 10px 0;
font-family: 'Lato', sans-serif;
font-weight: bold;
font-weight:700;
font-size:10px;
color:#fb0;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dt>a>em{
color:#fff;
font-size:14px;
font-weight:500;
letter-spacing:-1px;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dt>a.hover em,
#sungoliathCommonFt_01 nav>ul>li.on>dl>dt>a em{
color:#fb0;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd{
padding-bottom:1em;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd.hr{
border-top:1px solid #333;
padding-top:20px;
margin-top:10px;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd>a{
color:#fff;
font-size:12px;
line-height: 1.25;
letter-spacing:-0.125em;
display:inline-block;
}
#sungoliathCommonFt_01 nav>ul>li.interview>dl>dd>a,
#sungoliathCommonFt_01 nav>ul>li.column>dl>dd>a{
    letter-spacing:0;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd>a:hover{
color: #ffbb00;
}

#sungoliathCommonFt_01 nav>ul>li>dl>dd .position {
    display: flex;
    flex-wrap: wrap;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd .position li {
    width: 47.2222222222222%;
    padding-bottom: 1em;
}

#sungoliathCommonFt_01 nav>ul>li>dl>dd .position li a {
color:#fff;
font-size:12px;
line-height: 1.25;
letter-spacing:-0.125em;
display:inline-block;
}
#sungoliathCommonFt_01 nav>ul>li>dl>dd .position li a:hover{
color: #ffbb00;
}

/* #sungoliathCommonFt #sungoliathCommonFt_02
-------------------------------------------------- */
#sungoliathCommonFt_02{
background:#1a1a1a;
padding:40px 0;
}
#sungoliathCommonFt_02 section{
display:flex;
flex-wrap: wrap;
}

/* #sungoliathCommonFt_02 ul:nth-child(1)
-------------------------------------------------- */
#sungoliathCommonFt_02 ul.banner {
    width: 585px;
    height: 90px;
    position: relative;
}
#sungoliathCommonFt_02 ul.banner .banner_goods {
    position: absolute;
    top:0;
    left:0;
}
#sungoliathCommonFt_02 ul.banner .banner_member {
    position: absolute;
    top:-21px;
    left:292px;
}

#sungoliathCommonFt_02 ul.btn_sns {
    width: 565px;
    display: flex;
    justify-content: space-between;
}
#sungoliathCommonFt_02 ul.btn_sns li {
    width:97px;
}
#sungoliathCommonFt_02 ul.btn_sns li a {
    width: 97px;
    height:90px;
    text-indent: -99999px;
    background: #262626;
    display: block;
}
#sungoliathCommonFt_02 .btn_sns li.btn_facebook a {
  background:#262626 url(../img/icon_facebook.svg) no-repeat center center;
  background-size:20px auto;
}
#sungoliathCommonFt_02 .btn_sns li.btn_twitter a {
  background:#262626 url(../img/icon_x.svg) no-repeat center center;
  background-size:38px auto;
}
#sungoliathCommonFt_02 .btn_sns li.btn_instagram a {
  background:#262626 url(../img/icon_instagram.svg) no-repeat center center;
  background-size:40px auto;
}
#sungoliathCommonFt_02 .btn_sns li.btn_youtube a {
  background:#262626 url(../img/icon_youtube.svg) no-repeat center center;
  background-size:36px auto;
}
#sungoliathCommonFt_02 .btn_sns li.btn_line a {
  background:#262626 url(../img/icon_line.svg) no-repeat center center;
  background-size:41px auto;
}

#sungoliathCommonFt_02 ul li a:hover{
    opacity: .7;
}

/* #sungoliathCommonFt_02 ul:nth-child(3)
-------------------------------------------------- */
#sungoliathCommonFt_02 ul:nth-child(3){
position:absolute;
top:28px;
right:0;
display:table;
}
#sungoliathCommonFt_02 ul:nth-child(3) li{
display:table-cell;
vertical-align:middle;
padding-left:10px;
}
#sungoliathCommonFt_02 ul:nth-child(3) li a{
display:block;
}
#sungoliathCommonFt_02 ul:nth-child(3) li a.hover img{
opacity:0.85;filter:alpha(opacity=85);-ms-filter:"alpha(opacity=85)";
}
/* #sungoliathCommonFt_02 p
-------------------------------------------------- */
#sungoliathCommonFt_02 p{
/* position:absolute;
top:138px;
left:0; */
margin: 15px 0 0;
width:100%;
text-align: right;
}
#sungoliathCommonFt_02 p a{
font-size:11px;
line-height: 1;
color:#777;
}
#sungoliathCommonFt_02 p a.hover{
text-decoration:underline;
}

#sungoliathCommonFt_02 section .pc_none{
display: none;
}
/* #sungoliathCommonFt #sungoliathCommonFt_bnr
-------------------------------------------------- */
#sungoliathCommonFt_bnr{
background:#262626;
padding:40px 0;
}
#sungoliathCommonFt_bnr ul{
    display: flex;
    justify-content: center;
    gap: 30px;
}
#sungoliathCommonFt_bnr ul li{
width:430px;
}
#sungoliathCommonFt_bnr ul li a img{
width:100%;
height:auto;
}

/* #sungoliathCommonFt #sungoliathCommonFt_03
-------------------------------------------------- */
#sungoliathCommonFt_03{
background:#262626;
padding:0 0 40px;
}
#sungoliathCommonFt_03:after{content:""; clear:both; display:block;}
#sungoliathCommonFt_03 ul{
display: flex;
flex-wrap: wrap;
gap: 14px calc((100% - (120px * 7)) / 6);
}
#sungoliathCommonFt_03 ul li{
width:120px;
}
#sungoliathCommonFt_03 ul.first li:first-child{margin-left:0;}
#sungoliathCommonFt_03 ul li a{
display:block;
}
#sungoliathCommonFt_03 ul li a img{
width:100%;
height:auto;
}

/* =========================================================================
#sungoliath_contents
========================================================================= */
#sungoliath_contents{
padding-bottom: 120px;
background:#000 url(../img/bg_contents.jpg) no-repeat center 0 fixed;
}
#sungoliath_contents .row{
width:1160px;
margin:0 auto;
text-align:left;
}

/* ========================================================================
breadcrumbs
========================================================================= */
#suntory_contents .breadcrumbs {
    margin: 0 auto 25px;
    padding-top: 15px;
    width: 1160px;
    box-sizing: border-box;
}
#suntory_contents .breadcrumbs li {
    font-size: 12px;
    line-height: 18px;
    color: #fff;
    display: inline;
}
#suntory_contents .breadcrumbs li:first-child {
    padding: 0;
    width: 20px;
    height: 18px;
    position: relative;
}
#suntory_contents .breadcrumbs li:first-child a {
    display: inline-block;
    width: 20px;
    height: 18px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: url(../img/icon_home.svg) no-repeat 0 0;
    background-size: 20px auto;
    position: absolute;
    top: 0;
    left: 0;
}
#suntory_contents .breadcrumbs li a {
    color: #ffbb00;
    line-height: 18px;
}
#suntory_contents .breadcrumbs li a:hover {
    text-decoration: underline;
}
#suntory_contents .breadcrumbs li:before {
    content: '>';
    color: #fff;
    margin: 0 14px;
}
#suntory_contents .breadcrumbs li:first-child::before {
    content: '';
}
#suntory_contents .breadcrumbs li.this {
    line-height: 18px;
}

/* ========================================================================
title_container
========================================================================= */
#suntory_contents .title_container {
    margin: 0 auto 40px;
    padding: 0 50px;
    width: 1160px;
    box-sizing: border-box;
}
#suntory_contents .title_container .title {
    display: flex;
    align-items: flex-end;
}
#suntory_contents .title_container h1 {
    font-size: 38px;
    font-weight: bold;
    font-weight: 900;
    font-family: 'Roboto', sans-serif;
    color: #fff;
}
#suntory_contents .title_container .title_jp {
    margin-left: 30px;
    font-size: 16px;
    padding-bottom: .25em;
    color: #fff;
}

#suntory_contents .title_container .title_text {
    margin-left: 30px;
    font-size: 15px;
    padding-bottom: .25em;
    color: #fff;
}


/* ========================================================================
contents_container
========================================================================= */
#suntory_contents .contents_container {
    margin: 0 auto;
    width: 1160px;
    background: #fff;
    box-sizing: border-box;
}

#suntory_contents .contents_container.divided_contents {
    display: flex;
    justify-content: space-between;
    padding: 50px 40px 50px 50px;
}
#suntory_contents .contents_container.divided_contents .main_contents {
    width: 740px;
}
#suntory_contents .contents_container.divided_contents.article .main_contents {
    width: 790px;
}
#suntory_contents .contents_container.divided_contents aside {
    width: 280px;
    border-left: 1px #dedede solid;
    padding-left: 50px;
    box-sizing: border-box;
}
#suntory_contents .contents_container.divided_contents.article aside {
    width: 230px;
    border-left: none;
    padding-left: 0;
    box-sizing: border-box;
}

/* ========================================================================
aside
========================================================================= */
#suntory_contents .contents_container.divided_contents aside #parts_news h2 {
    font-size:18px;
    font-weight:bold;
    margin-bottom:30px;
}
#suntory_contents .contents_container.divided_contents aside #parts_news h2 em,
#suntory_contents .contents_container.divided_contents aside #parts_news .btn{
    display: none;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li {
    border-bottom: 1px #dedede solid;
    padding-bottom: 25px;
    margin-bottom: 30px;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li:last-child {
    border-bottom: none;
}

#suntory_contents .contents_container.divided_contents aside #parts_news li.ico_spirits dt {
    background: url(../img/icon_sprits.png) no-repeat 105px center;
    background-size: 115px auto;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li.ico_smilecafe dt {
    background: url(../img/icon_smile_cafe.png) no-repeat 105px center;
    background-size: 115px auto;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li.ico_clubhouse dt {
    background: url(../img/icon_club_house.png) no-repeat 105px center;
    background-size: 115px auto;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li.ico_news dt {
    background: url(../img/icon_news.png) no-repeat 105px center;
    background-size: 55px auto;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li.ico_game dt {
    background: url(../img/icon_game.png) no-repeat 105px center;
    background-size: 55px auto;
}

#suntory_contents .contents_container.divided_contents aside #parts_news li dt {
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 5px;
    padding-right: 130px;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li a dt {
    color: #444444;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li a dd {
    font-size: 13.5px;
    line-height: 1.481481481481481;
    color: #0077ff;
}
#suntory_contents .contents_container.divided_contents aside #parts_news li a:hover dd {
    text-decoration: underline;
}