﻿@charset "utf-8";


/**
base
*/
#suntoryCommonWrapper{ font-family:"游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ",meiryo,"ＭＳ ゴシック", sans-serif;}
#suntory_contents { width: 100%; margin: 0; padding: 0; font-size: 16px; color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); line-height: 1; }
#suntory_contents a { color: rgb(0, 0, 0); text-decoration: none; }
#suntory_contents a:link { color: rgb(0, 0, 0); }
#suntory_contents a:visited { color: rgb(0, 0, 0); }
#suntory_contents a:hover { color: rgb(0, 0, 0); text-decoration: none; }
#suntory_contents a:active { color: rgb(0, 0, 0); text-decoration: none; }
#suntory_contents a:hover img.fade { opacity: 0.5; }
#suntory_contents a:active img.fade { opacity: 0.5; }
#suntory_contents span.en_serif { font-family: "Times New Roman", serif; }
#suntory_contents span.en_sans { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
#suntory_contents span.jp_serif { font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }
#suntory_contents span.jp_sans { font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; }
#suntory_contents span.xxxlarge { font-size: 200%; line-height: 1.3; }
#suntory_contents span.xxlarge { font-size: 175%; line-height: 1.3; }
#suntory_contents span.xlarge { font-size: 150%; line-height: 1.3; }
#suntory_contents span.large { font-size: 125%; line-height: 1.3; }
#suntory_contents span.regular { font-size: 100%; line-height: 1.5; }
#suntory_contents span.small { font-size: 87.5%; line-height: 1.5; }
#suntory_contents span.xsmall { font-size: 81.2%; line-height: 1.3; }
#suntory_contents span.xxsmall { font-size: 75%; line-height: 1.3; }
#suntory_contents span.xxxsmall { font-size: 62.5%; line-height: 1.2; }
#suntory_contents span.bold { font-weight: bold }
@media screen and (max-width : 767px){
	#suntory_contents div.container_main {
		margin-top:-190px;
	}
}

/**
crumbs
*/
#crumbs{width:100%;background:#000;font-size:.69em;color:#ccc;margin-bottom:12px}
#crumbs div{width:960px;margin:0 auto;line-height:320%;position:relative}
ul#crumbs_left{float:left;width:700px;margin-left:14px}
ul#crumbs_left li{float:left}
ul#crumbs_left li a{color:#ccc !important}
ul#crumbs_left li a:hover{color:#fff;text-decoration:underline}
ul#crumbs_right{float:right;width:220px;height:25px;position:absolute;bottom:0;right:0}
ul#crumbs_right li{float:left;height:25px;margin-left:10px;text-indent:-9999px}
/* 0 - 767 */
@media screen and (max-width: 767px) {
#crumbs{display:none}
}

/**
nav
*/
.fixed{position:fixed;top:0}
#nav_container{ width:100%; background-color:#FFF !important; z-index:10000;}
#suntory_contents div.nav { margin: 10px auto; width: calc((157 + 127 + 114 + 141 + 128) * 1px);  }
#suntory_contents div.nav ul { margin: 0 auto;  background-color:#FFF;}
#suntory_contents div.nav ul li { float: left; }
#suntory_contents div.nav ul li:before { display: block; position: absolute; top: 12px; width: 1px; height: 16px; content: ""; background-color: rgb(30, 30, 30); }
#suntory_contents div.nav ul li ul li:before { width: 0; }
#suntory_contents div.nav ul li.n8:after { display: block; position: absolute; top: 12px; right: 0; width: 1px; height: 16px; content: ""; background-color: rgb(30, 30, 30); }
#suntory_contents div.nav ul li a { display: block; text-align: center; font-size: 74%; font-weight: bold;}
#suntory_contents div.nav ul li a:hover,
#suntory_contents div.nav ul li a:active { color: #c89a2f }
#suntory_contents div.nav ul li.n0 { display:none}
#suntory_contents div.nav ul li.n1 { width: 157px; }
#suntory_contents div.nav ul li.n2 { width: 127px; }
/* #suntory_contents div.nav ul li.n3 { width: 135px; } */
#suntory_contents div.nav ul li.n4 { width: 114px; }
#suntory_contents div.nav ul li.n5 { width: 141px; }
/* #suntory_contents div.nav ul li.n6 { width: 117px; } */
/* #suntory_contents div.nav ul li.n7 { width: 141px; } */
#suntory_contents div.nav ul li.n8 { width: 128px; }

@media only screen and (min-width: 768px) {
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01{width: 164px; font-size:84%;margin-left: -5px;box-shadow: 0 2px 4px -2px #555; z-index:10000;  }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01 a{ text-align:left !important; padding-left:14px;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02{width: 160px; font-size:84%;margin-left: -15px;box-shadow: 0 2px 4px -2px #555; z-index:10000;  }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02 a{ text-align:center !important; padding-left:14px;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4 .submenu.submenu04{width: 94px; font-size:84%; margin-left: 10px; box-shadow: 0 1px 3px -1px #555; z-index:10000;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5 .submenu.submenu05 { margin-left: 0px; width: 140px; font-size:84%; box-shadow: 0 1px 3px -1px #555; z-index:10000; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 .submenu.submenu06{width: 160px; margin-left:-22px;  font-size:84%;box-shadow:0 1px 3px -1px #555; z-index:10000;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n7 .submenu.submenu07{ font-size:84%;box-shadow:0 1px 3px -1px #555; z-index:10000;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08{ width: 200px; margin-left:-40px;  font-size:84%;box-shadow:0 1px 3px -1px #555; z-index:10000;}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08 a{ text-align:left !important; padding-left:24px;}
}


#suntory_contents .nav.dropmenu .n1:hover,#suntory_contents .nav.dropmenu .n2:hover,#suntory_contents .nav.dropmenu .n3:hover,#suntory_contents .nav.dropmenu .n5:hover,#suntory_contents .nav.dropmenu .n6:hover{background:#f8f3e8}
#suntory_contents .nav.dropmenu .clearfix.mainmenu .submenu li:hover > a{background:#c9992d;color:#FFF!important}
#suntory_contents .nav.dropmenu .clearfix.mainmenu .submenu li{border-top:1px solid #FFF}
#suntory_contents .nav.dropmenu li ul{display:none}
#suntory_contents .nav.dropmenu li:hover ul{display:block}
.dropmenu{*zoom:1;list-style-type:none;width:960px;margin:5px auto 30px;padding:0}
.dropmenu:before,.dropmenu:after{content:"";display:table}
.dropmenu:after{clear:both}
.dropmenu li{position:relative;width:20%;float:left;margin:0;padding:0}
.dropmenu li a{display:block;margin:0;padding:15px 0 11px;color:#fff;font-size:14px;line-height:1;text-decoration:none}
.dropmenu li.have_sub a:hover{background:#f8f3e8}
.dropmenu li ul{list-style:none;position:absolute;z-index:9999;top:100%;left:0;margin:0;padding:0}
.dropmenu li ul li{width:100%}
.dropmenu li ul li a{padding:13px 15px;background:#f8f3e8}

@media screen and (max-width: 767px) {
	.dropmenu li ul li a{width:100%;padding:15px 0;background-color:transparent}
	.dropmenu li a{padding:0}
	.dropmenu li.have_sub a:hover{background-color:transparent}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01 a{width:100%!important}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02 a{width:100%!important}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4 .submenu.submenu04,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4 .submenu.submenu04 a{width:100%!important}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5 .submenu.submenu05,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5 .submenu.submenu05 a{width:100%!important}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 .submenu.submenu06,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 .submenu.submenu06 a{width:100%!important}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08 a{width:100%!important}

	#suntory_contents div.nav ul li a:hover,#suntory_contents div.nav ul li a:active{color:#000}
	#suntory_contents .nav.dropmenu .n1:hover,#suntory_contents .nav.dropmenu .n2:hover,#suntory_contents .nav.dropmenu .n5:hover,#suntory_contents .nav.dropmenu .n8:hover{background-color:transparent}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .submenu li{border:none}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .submenu li:hover > a{background-color:transparent;color:#000!important}
	#suntory_contents .nav.dropmenu li:hover ul{display:block}
	#nav_container{ background-color:transparent !important; margin-top:-150px; height:0;}
	#suntory_contents div.nav { position: relative; margin: 0 auto; width: 94%; height: 0; padding:0 3%; z-index:10000; }
	#suntory_contents div.nav ul { display: none; position: absolute; width: 90%; background-color: transparent; z-index:10000;}
	#suntory_contents div.nav ul li:before { display: none; }
	#suntory_contents div.nav ul li.n7:after { display: none; }
	#suntory_contents div.nav ul li { float: none; width: 96%; margin:0; text-align: left; }
	#suntory_contents div.nav ul li.n2 { width: 0%; }
	#suntory_contents div.nav ul li.n3 { width: 90%; }
	#suntory_contents div.nav ul li.n4 { width: 90%; }
	#suntory_contents div.nav ul li.n6 { width: 90%; }
	#suntory_contents div.nav ul li.n7 { width: 90%; }
	#suntory_contents div.nav ul li.n8 { width: 90%; }
	#suntory_contents div.nav ul li.n8:after { display:none;}
	#suntory_contents div.nav ul li a { display: inline-block; font-size: 125%;  width:90%; text-align:left; border-bottom:#dedede 1px solid; padding:15px 0; padding-left:5.3%}
	#suntoryCommonWrapper #suntory_contents .submenu li{ display:block ;}
	#suntory_contents div.nav ul li.n0 { display:block; width: 90%; margin-top:-100px;}
	#suntory_contents div.nav ul li.n1 { width: 90%; height:360px ; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01{width: 90%;box-shadow: none; margin-top:-310px}
	#suntory_contents div.nav ul li.n2 { width: 90%; height:180px ; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02{width: 90%;box-shadow: none; margin-top:-132px}
	#suntory_contents div.nav ul li.n4 { width: 90%; height:140px; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4 .submenu.submenu04{box-shadow: none; margin-top:-92px}
	#suntory_contents div.nav ul li.n5 { width: 90%; height:480px; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5 .submenu.submenu05{box-shadow: none; margin-top:-430px; margin-left:0;}
	#suntory_contents div.nav ul li.n6 { width: 90%; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 .submenu.submenu06{box-shadow: none; margin-top:-92px; margin-left:0;}
	#suntory_contents div.nav ul li.n7{ width: 90%; height:208px }
	#suntory_contents div.nav ul li.n8{ width: 90%; height:208px; margin-top:0}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n7 .submenu.submenu07,#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08{ width:90%; margin-left:0 ;box-shadow: none; margin-top:-156px}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 ,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n7,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 {
		font-size:84%;
	}
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n1 .submenu.submenu01 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n4 .submenu.submenu04 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n5 .submenu.submenu05 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n6 .submenu.submenu06 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n7 .submenu.submenu07 a,
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n8 .submenu.submenu08 a {
		background: url(../images/common/sp_arrow.png) no-repeat right center;
		background-size:10px 17px;
		width:100% !important;
		padding-left:10% !important;
		font-size:92%;
	}
	#suntory_contents div.nav ul li a {  background:url(../images/common/sp_head_bar.gif) no-repeat left center; background-size:2% 40%;display: inline-block; font-size: 125%;  width:106%; text-align:left; border-bottom:#dedede 1px solid; padding:15px 0; padding-left:5.3%;}


	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02{width: 100%;margin-left: 0; }
	#suntory_contents .nav.dropmenu .clearfix.mainmenu .n2 .submenu.submenu02 a{ text-align:left !important;}
}

/**/
@media screen and (max-width: 767px) {
	#nav_container{ background-color:transparent !important; margin-top:190px; height:0;}
}

/**
main
*/

#suntory_contents div.main { margin-top: 15px;  padding: 40px 0 50px; width: 100%; background-color: #f8f3e8; }
#suntory_contents div.main div.section { margin:0 auto; width: 94%; max-width: 960px;}
#suntory_contents div.main div.section div.container { padding: 20px 10px; }

/* 0 - 767 */
@media screen and (max-width: 767px) {
	#suntory_contents div.main { margin-top:65px;}
	#suntory_contents div.main div.section { max-width: 94%; }
}


/* 0 - 767 */
@media screen and (max-width: 767px) {
	#suntory_contents div.main { margin-top:65px;}
	#suntory_contents div.main div.section { max-width: 94%; }
}

/**
foot
*/
#suntory_contents div.foot { padding: 50px 0; width: 100%; background-color: rgb(244, 244, 244); }
#suntory_contents div.foot div.container { margin: 0 auto; padding-left: 10px; width: 94%; max-width: 950px; }
#suntory_contents div.foot div.category { float: left; }
#suntory_contents div.foot div.category ul { margin-top: 5px; }
#suntory_contents div.foot div.category.n1 { width: 21%; }
#suntory_contents div.foot div.category.n2 { width: 18%; }
#suntory_contents div.foot div.category.n3 { width: 14%; }
#suntory_contents div.foot div.category.n4 { width: 25%; }
#suntory_contents div.foot div.category.n5 { width: 22%; }
#suntory_contents div.foot div.category.n1 ul { float: left; }
#suntory_contents div.foot div.category.n1 ul.n1 { width: 100%; }
#suntory_contents div.foot div.category.n2 h3 { margin-top: 20px; }
#suntory_contents div.foot div.category.n2 h3:first-child { margin-top: 0; }
#suntory_contents div.foot div.category.n4 h3 { margin-top: 20px; }
#suntory_contents div.foot div.category.n4 h3:first-child { margin-top: 0; }
#suntory_contents div.foot div.category.n5 h3 { margin-top: 20px; }
#suntory_contents div.foot div.category.n5 h3:first-child { margin-top: 0; }
#suntory_contents div.foot div.category h3 { position: relative; font-size: 81.2%; font-weight: bold; line-height: 1.5; }
#suntory_contents div.foot div.category h3 a:hover{ text-decoration:underline;}
#suntory_contents div.foot div.category h3:before { display: block; position: absolute; top: 50%; left: -10px; margin-top: -4px; width: 6px; height: 6px; content: ""; background-color: rgb(0, 0, 0); }
#suntory_contents div.foot div.category ul li { font-size: 75%; line-height: 1.9; }
#suntory_contents div.foot div.category ul li a { color: rgb(0, 0, 0); text-decoration: underline; }
#suntory_contents div.foot div.category ul li a:link { color: rgb(0, 0, 0); }
#suntory_contents div.foot div.category ul li a:visited { color: rgb(0, 0, 0); }
#suntory_contents div.foot div.category ul li a:hover { color: rgb(150, 150, 150); text-decoration: none; }
#suntory_contents div.foot div.category ul li a:active { color: rgb(150, 150, 150); text-decoration: none; }

/* 0 - 767 */
@media screen and (max-width: 767px) {
	#suntory_contents div.foot { display: none; }
}

/**
appendix
*/

/* #_burger */
#suntory_contents #_burger { display: none; position: absolute; }
@media screen and (max-width: 767px) {
	#suntory_contents { position: relative; }
	#suntory_contents #_burger { display: block; position: absolute; top: -180px; right: 20px; width: 42px; height: 42px; background: url("../images/common/btn_burger_close.png") center no-repeat; background-size: 42px; }
}

/* #_overlayer */
#suntory_contents #_overlayer { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.9); }

/**
depth
*/
#suntory_contents div.nav ul { z-index: 1001; }
#suntory_contents #_burger { z-index: 10000; }
#suntory_contents #_overlayer { z-index: 1000; }
