@charset "utf-8";

#suntoryCommonWrapper .pc_none{
display:none;
}

/* clearfix */

.clearfix:after {
    content: "."; 
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
 
.clearfix {
    min-height: 1px;
}
 
* html .clearfix {
    height: 1px;
    /*¥*//*/
    height: auto;
    overflow: hidden;
    /**/
}

.pc_only { display: inline-block;}
.sp_only { display: none;}


/* Reset
======================================================================== */
html, body{
margin:0;
padding:0;
border:0;
}

img{
border:0;
}

/* #wrapper Reset
======================================================================== */
#wrapper{
margin:0;
padding:0;
border:0;
overflow:hidden;
}

#wrapper h1,#wrapper h2,#wrapper h3,#wrapper h4,#wrapper h5,#wrapper h6,#wrapper p,#wrapper a,#wrapper ol,#wrapper ul,#wrapper li,#wrapper dl,#wrapper dt,#wrapper dd,#wrapper table,#wrapper thead,#wrapper tbody,#wrapper th,#wrapper td,#wrapper form,#wrapper br,#wrapper address,#wrapper button,#wrapper em,#wrapper i,#wrapper span,#wrapper strong{
margin:0;
padding:0;
border:0;
font-size:100%;
font:inherit;
font-style:normal;
vertical-align:baseline;
outline:none;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
font-family:"suntory sabon";
-webkit-text-size-adjust:100%;
letter-spacing: 0.5px;
}

#wrapper table{
border-collapse:collapse;
text-align:left;
}

#wrapper input{
vertical-align:middle;
}

#wrapper ol,#wrapper ul,#wrapper li{
list-style:none;
}

#wrapper a{
cursor:pointer;
outline:none;
text-decoration:none;
}

#wrapper .on a.hover{
cursor:default;
}

#wrapper a,
#wrapper input,
#wrapper button{
background-color:transparent;
-webkit-touch-callout:none;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}

#wrapper a:link{/*color:#06c;*/color:#322517;}
#wrapper a:visited{/*color:#579ab9;*/color:#322517;}
#wrapper a:active{/*color:#0cf;*/color:#322517;}
#wrapper a:hover{/*color:#0cf;*/color:#322517;text-decoration:underline;opacity:0.7;}

#wrapper img{
-ms-interpolation-mode:bicubic;
}



/* #container .contents
======================================================================= */
#container .contents{
	background: #efece3;
}


/* #container .contents #main_contents
======================================================================= */
#main_contents{
width:960px;
margin:0 auto;
padding: 45px 0 60px 0;
text-align: left;
color: #322517;
}


/* #qa_contents
======================================================================= */
#qa_contents {
	width: 920px;
	margin: 0 auto 30px auto;
	padding: 20px 20px 10px 20px;
	background-color: #fff;
}

#qa_contents a:hover img{
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
}

#qa_contents #menu {
	margin: 15px 10px 0 10px;
}

#qa_contents #menu ul {
	overflow: hidden;
	width: 100%;
}

#qa_contents #menu ul li {
	width: 28%;
    margin-right: 2%;
    float: left;
    border: 1px solid #6a4b34;
    border-radius: 8px;
    font-size: 20px;
    font-weight: bold;
    color: #6a4b34;
	height: 60px;
	position: relative;
}

#qa_contents #menu ul li:after {
	content: '';
    width: 10px;
    height: 10px;
    border: 0px;
    border-top: solid 2px #6a4b34;
    border-right: solid 2px #6a4b34;
    position: absolute;
    top: 45%;
    right: 20px;
    transform: translateY(-50%) translateX(-50%) rotate(135deg);
}


#qa_contents #menu ul li:hover {
	cursor: pointer;
	opacity: 0.7;
}

#qa_contents #menu ul li span {
    display: block;
    position: absolute;
    top: 50%;
    left: 35px;
    right: 0;
    transform: translate(0, -50%);
}

#qa_contents #menu ul li span.menu_small {
	font-size: 90%;
}


#qa_contents #menu ul li:nth-child(2) {
	width: 40%;
}

#qa_contents #menu ul li:nth-child(3) {
	margin-right: 0;
}




#qa_contents .sub_block {
	width: 860px;
	margin: 30px auto 30px auto;
}


/* #main_title
=========================== */

/* top */

#qa_contents #main_visual {
	width: 100%;
	margin-bottom: 15px;
}

#qa_contents #main_visual img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

#qa_contents #main_title.top {
	background: #f9ecd4;
	padding: 5px;
}

#qa_contents #main_title.top h1 {
	font-size: 22px;
	color: #6a4b34;
	padding: 5px 20px 0;
	background: url(https://www.suntory.com/factory/qa/img/bg_ttl_top.gif) left center no-repeat;
}

/* yamazaki/hakushu */
#qa_contents #main_title.detail {
	background: #f9ecd4;
	padding: 5px 10px 5px 5px;
}

#qa_contents #main_title.detail h1 {
	color: #6a4b34;
	font-size: 24px;
	padding: 5px 10px 0;
	float: left;
}

#qa_contents #main_title.detail h1.yamazaki {
	border-left: 8px solid #743a1d;
}

#qa_contents #main_title.detail h1.hakushu {
	border-left: 8px solid #009a22;
}

#qa_contents #main_title.detail .btn_back {
	float: right;
    margin-top: 5px;
}



/* #qa_contents h2
   #qa_contents h3
=========================== */
#qa_contents h2 {
    color: #6a4b34;
    font-size: 20px;
    font-weight: bold;
}

#qa_contents h2.yamazaki, #qa_contents h2.hakushu {
    color: #6a4b34;
    font-size: 24px;
    border-bottom: 2px solid #743a1d;
    padding: 5px;
}

#qa_contents h2 p.title {
	border-left: 8px solid #743a1d;
    padding: 0 10px;
}

#qa_contents h2.hakushu p.title {
	border-left: 8px solid #009a22;
}

#qa_contents h3 {
	color: #6a4b34;
	font-size: 24px;
	border-bottom: 2px solid #6a4b34;
	margin: 0 0 20px 0;
	line-height: 1.2em;
	padding: 0 0 5px 0;
}


/* #FAQ top
=========================== */
#qa_contents .sub_block_top {
		width: 900px;
		margin: 30px auto 30px auto;
	}

#qa_contents .qa_category{
	margin-bottom: 40px;
}

#qa_contents .question{
	margin: 20px 0;
	font-weight: bold;
	font-size: 18px;
	overflow: hidden;
	padding: 20px 10px;
	background: url(https://www.suntory.com/factory/qa/img/qa_btn_on.png) right 20px center no-repeat;
	background-size: 24px;
    background-color: #faf7f0;
	line-height: 18px;
}

#qa_contents .question.active{
	background: url(https://www.suntory.com/factory/qa/img/qa_btn_off.png) right 20px center no-repeat;
	background-size: 24px;
    background-color: #faf7f0;
}

#qa_contents .Q{
	margin: 0 5px 0 0;
	color: #d6500d;
	font-size: 26px;
	display:block;
	float: left;
	width: 75px;
}

#qa_contents .answer {
	padding: 0 10px 30px 10px;
	font-size: 14px;
	line-height: 2em;
	/*border-bottom: 1px dashed #bea091;*/
	overflow: hidden;
	display: none;
}

#qa_contents .answer p.ex{
	text-indent: -1em;
	padding-left: 1em;
}

#qa_contents .A{
	margin: 0 5px 0 0;
	color: #552209;
	font-size: 26px;
	font-weight: bold;
	display:block;
	float: left;
	width: 75px;
}

#qa_contents span.small {
	font-size: 80%;
}

#qa_contents .q_detail{
	width: calc( 100% - 130px );
	display: block;
    float: left;
	line-height: 130%;
}

#qa_contents .a_detail{
	width: calc( 100% - 100px );
	display: block;
    float: left;
	font-size: 16px;
}

#qa_contents .a_detail .outside_link {
	font-weight: bold;
}

#qa_contents .a_detail .outside_link a {
	text-decoration: underline;
}


#qa_contents ul.linkbt {
	width: 100%;
	margin: 15px 0 0 0;
}

#qa_contents ul.linkbt li {
	width: 48.5%;
	margin-right: 3%;
	float: left;
}

#qa_contents ul.linkbt li:last-child {
	margin-right: 0;
}

#qa_contents ul.linkbt li a {
	width: 100%;
	height: 43px;
	display: block;
}

#qa_contents ul.linkbt li:first-child a {
	background: url(https://www.suntory.com/factory/qa/img/linkbt_yamazaki.png) left -8px top no-repeat;
	background-size: auto 43px;
}

#qa_contents ul.linkbt li:last-child a {
	background: url(https://www.suntory.com/factory/qa/img/linkbt_hakushu.png) left -8px top no-repeat;
	background-size: auto 43px;
}

#qa_contents ul.text_link li a {
	display: block;
	padding-left: 25px;
	position: relative;
	color: #2a2a2a;
	text-decoration: underline;
}

#qa_contents ul.text_link li a:hover {
	cursor: pointer;
	text-decoration: underline;
}

#qa_contents ul.text_link li a:before {
	content: '';
    width: 8px;
    height: 8px;
    border: 0px;
    border-top: solid 2px #2a2a2a;
    border-right: solid 2px #2a2a2a;
    transform: translateY(-50%) translateX(-50%) rotate(45deg);
    position: absolute;
    top: 46%;
    left: 10px;
}





/* make_reservation
=========================== */
#qa_contents .make_reservation {
	background: #f9ecd4;
	margin-bottom: 30px;
	padding: 20px;
	font-size: 13px;
	line-height: 1.5em;
}
#qa_contents .make_reservation h3 {
	color: #6a4b34;
	font-size: 22px;
    border-bottom: none;
    margin: 0 0 20px 0;
    padding: 0;
}
#qa_contents .make_reservation .hl_em {
	color: #dd0000;
	font-size: 14px;
	text-indent: -0.8em;
	padding: 0 0 20px 0.8em;
}
#qa_contents .make_reservation .layout {
	display: table;
}
#qa_contents .make_reservation .left_box{
	width: 520px;
	display: table-cell;
	padding-right: 20px;
}
#qa_contents .make_reservation .left_box .hl{
	background: #e1ac52;
	text-align: center;
	color: #fff;
	font-size: 22px;
	padding: 10px 0;
}
#qa_contents .make_reservation .left_box .in{
	background: #fff;
	padding: 20px;
}
#qa_contents .make_reservation .left_box .in img{
	padding: 10px 0 20px 0;
}
#qa_contents .make_reservation .left_box .in p.complete{
	font-size: 22px;
	padding: 30px 0 10px 0;
	padding-top: 10px;
}
#qa_contents .make_reservation .left_box .in p.indent{
	text-indent: -1.4em;
	padding: 0 0 0 1.4em;
	font-size: 18px;
}
#qa_contents .make_reservation .left_box .in p.em{
	color: #dd0000;
	padding: 0;
	font-size: 14px;
}
#qa_contents .make_reservation .left_box .in p.mt1em{
	margin-top: 1em;
}

#qa_contents .make_reservation .right_box{
	width: 280px;
	margin-left : 30px;
	display: table-cell;
	background : #fff;
}
#qa_contents .make_reservation .right_box .hl{
	background: #479bad;
	text-align: center;
	color: #fff;
	font-size: 22px;
	padding: 10px 0;
}
#qa_contents .make_reservation .right_box .in{
	background: #fff;
	padding: 20px;
}
#qa_contents .make_reservation .right_box .in p.phone{
	font-size: 21px;
	font-weight: bold;
	padding-bottom: 20px;
}
#qa_contents .make_reservation .right_box .in p.phone{
	padding-bottom: 20px;
}
#qa_contents .make_reservation .right_box .in p.phone a{
	color: #322517;
	font-size: 21px;
	font-weight: bold;
	background: url(https://www.suntory.com/factory/qa/img/tel_ico.png) no-repeat 0 52%;
	padding: 0 0 0 20px;
}
#qa_contents .make_reservation .right_box .in p.em{
	font-size: 15px;
	text-indent: -1em;
	padding: 0 0 1em 1em;
}
#qa_contents .make_reservation .right_box .in p.em.red{
	color: #dd0000;
}
#qa_contents .make_reservation .right_box .in p.please{
	font-size: 18px;
	padding: 10px 0;
}
#qa_contents .make_reservation .right_box .in ul{
	padding: 0 0 20px 0;
}
#qa_contents .make_reservation .right_box .in ul li{
	font-size: 16px;
	text-indent: -1em;
	padding: 0 0 0 1em;
	line-height: 160%;
}








/* download_app
=========================== */
#qa_contents .download_app {
	background: #f9ecd4;
	margin-bottom: 30px;
	padding: 20px;
	font-size: 13px;
	line-height: 1.5em;
}
#qa_contents .download_app p {
	margin-top: 1em;
}
#qa_contents .download_app a {
	text-decoration: underline;
}
#qa_contents .download_app a:hover {
	text-decoration: none;
}












#qa_contents p.explain_head {
	font-size: 18px;
	line-height: 160%;
	margin: 0 0 5px 0;
}

#qa_contents p.explain_mbt {
	margin-bottom: 30px;
	font-size: 18px;
}

#qa_contents p.explain {
	font-size: 16px;
	line-height: 150%;
	text-indent: -1em;
	padding-left: 1em;
	margin: 0 0 15px 0;
}
#qa_contents p.explain_em {
	font-size: 14px;
	color: #dd0000;
	text-indent: -1em;
	padding-left: 1em;
	margin: 15px 0 15px 0;
}
#qa_contents span.explain_em {
	color: #dd0000;
}
#qa_contents ul.explain_list li {
	font-size: 16px;
	line-height: 160%;
	text-indent: -1em;
	padding-left: 1em;
	margin: 0 0 5px 0;
}

#qa_contents p.btn {
	text-align: center;
	margin: 20px 0 60px 0;
}

#qa_contents p.btn_tour {
	margin: 10px 0 30px 80px;
}

#qa_contents .qa_category .question:first-child {
    margin-top: 12px;
}

#qa_contents .qa_category {
    margin-bottom: 60px;
}





/* important_attention
=========================== */
#suntory_contents #important_attention {
    margin: 20px auto;
    border: 1px solid #dc0000;
    /*border-radius: 5px;*/
	background-color: #fff;
}
#suntory_contents #important_attention p a {
    color: #000;
	display: block;
    padding: 15px 20px;
    position: relative;
}
#suntory_contents #important_attention p a span.part1 {
	padding: 4px 4px 4px 6px;
    background-color: #dc0000;
    color: #fff;
    font-weight: bold;
    float: left;
}
#suntory_contents #important_attention p a span.part2 {
	margin-left: 125px;
    display: block;
    line-height: 130%;
    font-weight: bold;
    text-align: left;
	height: 29px; /*PC1行の時のみ*/
    line-height: 29px; /*PC1行の時のみ*/
}