@charset "Shift_JIS";

/*----------------
PC
----------------*/
@media screen and (min-width: 768px){
	#suntory_contents{
	text-align:center;
	background-image:url("../img/common/bg.jpg");
	}

	#suntory_contents #container{
	width:890px;
	margin:0 auto;
	padding-bottom:30px;
	text-align:left;
	background-color:#faf7cf;
	position:relative;
	}

	#suntory_contents #container #left_area{
	width:200px;
	float:left;
	}

	#suntory_contents #container #left_area #back_number{
	margin-top:55px;
	}

	#suntory_contents #container #left_area #back_number ul li{
	margin:15px 15px 0;
	color:#00F;
	font-size:80%;
	font-weight:bold;
	line-height:1.4;
	}

	#suntory_contents #container #left_area #back_number ul li a {
	text-decoration: none;
	color:#333;
	}

	#suntory_contents #container #left_area #back_number ul li a:hover {
	text-decoration: underline;
	color:#F00;
	}

	#suntory_contents #container #left_area #back_number #to_top{
	margin:20px 0 0 13px;
	font-size:80%;
	font-weight:bold;
	line-height:1.4;
	}

	#suntory_contents #container #left_area #back_number #to_top a{
	min-height:40px;
	_height:42px;
	padding:2px 0 0 50px;
	color:#323232;
	text-decoration:none;
	display:inline-block;
	background:url(../img/common/icon_to_top_off.gif) left top no-repeat;
	}

	#suntory_contents #container #left_area #back_number #to_top a:hover{
	color:#ec1c00;
	text-decoration:underline;
	background:url(../img/common/icon_to_top_on.gif) left top no-repeat;
	}

	#suntory_contents #container #main_area{
	/*width:418px;*/
	width:490px;
	margin-bottom:20px;
	/*padding:0 38px 18px 34px;*/
	background-color:#fff;
	float:left;
	}

	#suntory_contents #container #main_area h2{
	/*margin-bottom:26px;*/
	margin: 0 38px 26px 34px;
	}

	#suntory_contents #container #main_area .large{
	/*margin-bottom:26px;*/
	margin:0 0 26px 0 ;
	}

	#suntory_contents #container #main_area .no21{
	/*margin-bottom:26px;*/
	margin: 0 38px 76px 34px;
	}

	#suntory_contents #container #main_area #txt_area{
	/*margin-bottom:36px;*/
	margin:0 38px 36px 34px;
	}

	#suntory_contents #container #main_area #txt_area p{
	font-size:80%;
	line-height:1.8;
	color:#323232;
	text-indent:1em;
	}

	#suntory_contents #container #main_area #txt_area #end{
	margin:1em 0 45px 0;
	text-align:right;
	}

	#suntory_contents #container #main_area #txt_area .img{
	text-align:center;
	text-indent:0;
	}

	#suntory_contents #container #main_area #page_nav{
	text-align:center;
	margin:0 38px 18px 34px;
	}

	#suntory_contents #container #main_area #page_nav ul{
	width:4.2em;
	height:1em;
	margin:0 auto;
	_margin:0;
	border-left:solid 1px #696969;
	}

	#suntory_contents #container #main_area #page_nav ul li{
	width:2em;
	color:#fb0000;
	line-height:1;
	border-right:solid 1px #696969;
	float:left;
	}

	#suntory_contents #container #main_area #page_nav ul li a{
	color:#323232;
	text-decoration:none;
	}

	#suntory_contents #container #main_area #page_nav ul li a:hover{
	text-decoration:underline;
	}

	#suntory_contents #container #right_area{
	width:200px;
	float:left;
	}

	#suntory_contents #container #right_area .txt{
	font-size:80%;
	line-height:180%;
	margin-bottom:50px;
	margin-left:10px;
	}

	#suntory_contents #container #right_area .txt2{
	font-size:80%;
	line-height:180%;
	margin-bottom:10px;
	margin-left:10px;
	}

	#suntory_contents #container #sealingbeam6{
	margin:3px 0 330px 40px;
	}
	
	#suntory_contents #container #sealingbeam7{
	margin:3px 0 337px 40px;
	}
	
	#suntory_contents #container #sealing{
	margin:3px 0 220px 40px;
	}
	
	#suntory_contents #container #sealing02{
	margin:10px 0 322px 28px;
	}

	#suntory_contents #container .socialbutton_suntory{
	margin-left:300px;
	clear:both;
	}

	#suntory_contents #container .socialbutton_suntory .socialbutton_suntory_wrapper{
	height:35px;
	}

	#suntory_contents #container ul#left_nav{
	left:26px;
	bottom:49px;
	position:absolute;
	}

	#suntory_contents #container ul#left_nav li{
	margin-top:8px;
	}

	#suntory_contents #container #logo_bourbon{
	right:10px;
	bottom:48px;
	position:absolute;
	}


	.clear:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
	}

	*+html .clear{
	min-height:1%;
	}

	*html .clear{
	height:1%;
	overflow:visible;
	}

	#suntory_contents .sp_item {
	display: none!important;
	}
}


/*----------------
SP
----------------*/
@media screen and (max-width: 767px){

	#suntory_contents img {
		width: 100%;
		height: auto;
	}

	#suntory_contents .pc_item {
		display: none!important;
	}
	
	#suntory_contents #container {
		display: flex;
		flex-direction: column;
	}
	
	#suntory_contents #container > h1 {
		order: 1;
		height: 14.9vw;
		border-bottom: 0.666666667vw solid #fb0000;
	}
	
	#suntory_contents #container > h1 > img {
		padding: 0;
		margin: 0;
		vertical-align: bottom;
	}
	
	#area_wrap {
		display: flex;
		flex-direction: column;
		order: 2;
	}
	#suntory_contents #container #main_area {
		order: 1;
		position: relative;
	}
	
	#suntory_contents #container #main_area #number {
		position: absolute;
		width: 14vw;
		top: -5.3vw;
		left: 50%;
		transform: translate(-50%,0);
	}

	#suntory_contents #container #main_area h2 {
		padding: 0 0 6.5vw;
	}

	#suntory_contents #container #main_area #txt_area {
		background: #fcfae5;
		padding: 5vw 6.4vw;
	}

	#suntory_contents #container #main_area #txt_area.sub_none {
		padding: 12vw 6.4vw;
	}

	#suntory_contents #container #main_area #txt_area > p {
		font-size: 4vw;
		text-indent: 1em;
		line-height: 7.6vw;
	}

	#suntory_contents #container #main_area #txt_area #end {
		text-align: right;
	}

	#suntory_contents #container #main_area #page_nav > ul {
		display: flex;
		justify-content: center;
		padding-top: 6.8vw;
	}

	#suntory_contents #container #main_area #page_nav > ul > li {
		width: 14vw;
		text-align: center;
		color: #fb0000;
		font-weight: bold;
		font-size: 5vw;
		line-height: 4.5vw;
		border-right: 1px solid #000;
	}

	#suntory_contents #container #main_area #page_nav > ul > li:first-of-type {
		border-left: 1px solid #000;
		border-right: 1px solid #000;
	}

	#suntory_contents #container #main_area #page_nav > ul > li > a {
		color: #000;
		text-decoration: none;
	}

	#suntory_contents #container #main_area .txt {
		font-size: 2.8vw;
		text-align: center;
		line-height: 4.2vw;
		margin: 2vw 0 8.5vw;
	}
	
	#suntory_contents #container #right_area {
		order: 2;
	}
	
	#suntory_contents #container #right_area > p {
		width: 53.3333333vw;
		margin: 0 auto;
		padding-top: 13.0666667vw;
	}
	
	#suntory_contents #container #right_area #sealing {
		display: none;
	}

	#suntory_contents #container #right_area #sealing02 {
		display: none;
	}

	#suntory_contents #container #right_area #sealingbeam6 {
		display: none;
	}

	#suntory_contents #container #right_area .bottom_img {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: calc(100% - 12.8vw);
	}

	#suntory_contents #container #right_area .bottom_img img {
		width: 49%;
		height: 100%;
	}
	
	#suntory_contents #container #left_area {
		order: 3;
		margin-top: 12.4vw;
		padding-bottom: 6.5vw;
		border-top: 0.8vw solid #fb0000;
		background: #faf6d3;
	}
	
	#suntory_contents #container #left_area > p {
		width: 43vw;
		margin: 3vw auto 7vw;
	}
	
	#suntory_contents #container #left_area #back_number {
		border-top: 0.8vw solid #fb0000;
	}
	
	#suntory_contents #container #left_area #back_number > ul {
		padding: 5.5vw 5.5vw 0;
	}
	
	#suntory_contents #container #left_area #back_number > ul > li {
		color: #1e43a2;
		font-size: 3.73333334vw;
		line-height: 5.4vw;
		font-weight: bold;
		padding-left: 7.5vw;
		margin-top: 4vw;
		background: url("../img/link_arrow.png") no-repeat;
		background-size: 2.4vw;
		background-position: left 0.5vw;
	}
	
	#suntory_contents #container #left_area #back_number > ul > li:first-of-type {
		margin-top: 0;
	}
	
	#suntory_contents #container #left_area #back_number > ul > li > a {
		color: #000;
		text-decoration: none;
	}

	#suntory_contents #container #left_area #back_number #to_top {
		color: #1e43a2;
		font-size: 3.73333334vw;
		line-height: 5.4vw;
		font-weight: bold;
		padding-left: 7.5vw;
		margin: 4.6vw 0 0 5.5vw;
		background: url("../img/link_arrow.png") no-repeat;
		background-size: 2.4vw;
		background-position: left 0.5vw;
	}

	#suntory_contents #container #left_area #back_number #to_top > a {
		color: #000;
		text-decoration: none;
	}

	#suntory_contents #container #link_area {
		order: 3;
		background: #faf6d3;
		border-top: 0.8vw solid #fb0000;
		border-bottom: 0.6vw solid #fb0000;
	}
	
	#suntory_contents #container #link_area {
		padding: 5.5vw;
	}
	
	#suntory_contents #container #link_area > li {
		color: #1e43a2;
		font-size: 3.73333334vw;
		line-height: 5.4vw;
		font-weight: bold;
		padding-left: 7.5vw;
		margin-top: 6.5vw;
		background: url("../img/link_arrow.png") no-repeat;
		background-size: 2.4vw;
		background-position: left 0.5vw;
	}
	
	#suntory_contents #container #link_area > li:first-of-type {
		margin-top: 0;
	}
	
	#suntory_contents #container #link_area > li > a {
		color: #000;
		text-decoration: none;
	}

}