@charset "utf-8";

/* for SP*/



/*------------------------------------------------------------
btn_enquete（SP）
------------------------------------------------------------ */
#suntory_contents .btn_enquete {
	width:64vw;
	height:16vw;
	background:url(../img/enquete/balloon.svg) no-repeat 0 0;
	background-size:64vw 16vw;
	filter: drop-shadow(1.066666666666667vw 1.066666666666667vw 2.133333333333333vw rgba(0,0,0,.1));
	display:flex;
	align-items:flex-start;
	justify-content:center;
	font-size:3.733333333333333vw;
	line-height:12vw;
	font-weight:bold;
	color: #002A64;
	cursor: pointer;
	position:fixed;
	bottom:9.6vw;
	left:calc(50% - 32vw);
	z-index:1000;
	opacity:1;
	transition: opacity .75s;
	transform: translate(0,0);
}
#suntory_contents.enquete_active .btn_enquete {
	opacity:0;
	transform: translate(0,100vh);
}
#suntory_contents .btn_enquete.hide {
	opacity:0;
	transform: translate(0,100vh);
}

/*------------------------------------------------------------
enquete（SP）
------------------------------------------------------------ */
#suntory_contents .enquete {
	position:fixed;
	top: 0;
	left:0;
	background:#fff;
	z-index: 1000;
	width:100vw;
	height:100vh;
	transform: translate(0,100vh);
	opacity:0;
	transition: all .75s;
	z-index:10000;
}
#suntory_contents.enquete_active .enquete {
	transform: translate(0,0);
	opacity:1;
}
#suntory_contents .enquete .title_bar {
	background:#FDC129;
	width:100%;
	height:9.6vw;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:4.266666666666667vw;
	font-weight:bold;
	color: #002A64;
	position:relative;
}
#suntory_contents .enquete .title_bar .btn_enquete_close {
	width:12.8vw;
	height:9.6vw;
	background:url(../img/enquete/btn_close.svg) no-repeat center center;
	background-size:4.8vw auto;
	position:absolute;
	top:0;
	right:0;
	cursor: pointer;
	z-index:10000;
}

#suntory_contents .enquete .enquete_container {
	padding:4vw 4vw 6.666666666666667vw;
	height:calc(100vh - 9.6vw);
	overflow-y: auto;
}

#suntory_contents .enquete .enquete_container dl {
	margin-bottom:6vw;
}
#suntory_contents .enquete .enquete_container dl.comment_form {
	margin-bottom:4vw;
}

#suntory_contents .enquete .enquete_container dt {
	margin-bottom:4vw;
	font-size:4vw;
	font-weight:bold;
	line-height: 4.8vw;
	color:#002A64;
	background:url(../img/enquete/q.svg) no-repeat 0 center;
	background-size:6.4vw 4.8vw;
	padding-left:9.333333333333333vw;
	letter-spacing:-0.05em;
}
#suntory_contents .enquete .enquete_container dt.messege {
	background:none;
	padding:0;
	line-height:1.5;
}
#suntory_contents .enquete .enquete_container dt.messege span {
	font-weight:normal;
}

#suntory_contents .enquete .enquete_container dd.option5,
#suntory_contents .enquete .enquete_container dd.option3 {
	display:flex;
	justify-content: space-between;
}
#suntory_contents .enquete .enquete_container input[type="radio"] {
	display:none;
}
#suntory_contents .enquete .enquete_container input[type="radio"] + label {
	background:#FCFAEA url(../img/enquete/icon_radio_off.svg) no-repeat center 2.4vw;
	background-size:4vw 4vw;
	color: #002A64;
	font-size:3.733333333333333vw;
	line-height:1.2;
	width:16.8vw;
	height:20vw;
	border-radius: 1.6vw;
	display:flex;
	justify-content: center;
	align-items: flex-start;
	text-align: center;
	padding-top: 9.066666666666667vw;
}
#suntory_contents .enquete .enquete_container input[type="radio"]:checked + label {
	background:#FFDE66 url(../img/enquete/icon_radio_on.svg) no-repeat center 2.4vw;
	background-size:4vw 4vw;
}
#suntory_contents .enquete .enquete_container .option3 input[type="radio"] + label {
	width:28vw;
}

#suntory_contents .enquete .enquete_container .comment {
	margin:0 0 2vw;
	webkit-appearance: none;
	appearance: none;
	resize: none;
	outline: none;
	background: transparent;
	border:0.266666666666667vw #CCCCCC solid;
	padding:2.666666666666667vw;
	font-size:16px;
	width:92vw;
	box-sizing: border-box;
}
#suntory_contents .enquete .enquete_container .btn_submit {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	outline: none;
	background: transparent;
	width:56vw;
	height:12vw;
	border:0.266666666666667vw #0058D1 solid;
	display:flex;
	align-items:center;
	justify-content: center;
	color: #0058D1;
	font-size:4.8vw;
	font-weight:bold;
	border-radius:6.933333333333333vw;
	margin:0 auto;
}

/*------------------------------------------------------------
enquete_done （SP）
------------------------------------------------------------ */
#suntory_contents .enquete_done {
	padding:12vw 0;
}
#suntory_contents .enquete_done .text {
	margin-bottom:12vw;
	font-size:4.8vw;
	text-align: center;
	color:#002A64;
}
#suntory_contents .enquete_done .back2article {
	text-align: center;
}
#suntory_contents .enquete_done .back2article a {
	color: #0058D1;
	font-size:3.733333333333333vw;
	text-decoration: underline;
	display:inline-block;
	background:url(../img/enquete/arrow_l_blue.svg) no-repeat 0 center;
	background-size:1.8vw auto;
	padding-left:3.733333333333333vw;
}


@media screen and (min-width:768px){
/* for PC */

/*------------------------------------------------------------
btn_enquete（PC）
------------------------------------------------------------ */
#suntory_contents .btn_enquete {
	width:150px;
	height:114px;
	background:url(../img/enquete/pc_balloon.svg) no-repeat 0 0;
	background-size:150px 114px;
	filter: drop-shadow(5px 5px 10px rgba(0,0,0,.1));
	display:flex;
	align-items:flex-start;
	justify-content:center;
	font-size:18px;
	line-height:1.333333333333333;
	font-weight:bold;
	color: #002A64;
	cursor: pointer;
	padding:15px;
	position:fixed;
	bottom:80px;
	left:calc(100% - 290px);
	z-index:1000;
	opacity:1;
	transition: opacity .75s;
	transform: translate(0,0);
}
#suntory_contents .btn_enquete:hover {
	background:url(../img/enquete/pc_balloon_on.svg) no-repeat 0 0;
	background-size:150px 114px;
}
#suntory_contents.enquete_active .btn_enquete{
	opacity:0;
	transform: translate(0,100vh);
}
#suntory_contents .btn_enquete.hide{
	opacity:0;
	transform: translate(0,100vh);
}

/*------------------------------------------------------------
enquete（PC）
------------------------------------------------------------ */
#suntory_contents .enquete {
	position:fixed;
	top: auto;
	bottom: 50px;
	left:calc(50% - 500px);
	background:#fff;
	z-index: 1000;
	width:1000px;
	height:auto;
	transform: translate(0,100vh);
	opacity:0;
	transition: all .75s;
	z-index:10000;
	border-radius: 5px;
}
#suntory_contents.enquete_active .enquete {
	transform: translate(0,0);
	opacity:1;
}
#suntory_contents .enquete .title_bar {
	background:#FDC129;
	width:100%;
	height:40px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:20px;
	color: #002A64;
	position:relative;
	border:2px #FDC129 solid;
	border-radius: 5px 5px 0 0;
	
}
#suntory_contents .enquete .title_bar .btn_enquete_close {
	width:60px;
	height:40px;
	background:url(../img/enquete/btn_close.svg) no-repeat center center;
	background-size:18px auto;
	position:absolute;
	top:0;
	right:0;
	cursor: pointer;
	z-index:10000;
}
#suntory_contents .enquete .title_bar .btn_enquete_close:hover {
	opacity:.75;
}
#suntory_contents .enquete .enquete_container {
	padding:30px 30px 35px;
	height:auto;
	overflow-y: visible;
	border:2px #FDC129 solid;
	border-radius: 0 0 5px 5px;
}

#suntory_contents .enquete .enquete_container dl {
	margin-bottom:30px;
	display:flex;
	justify-content: space-between;
}
#suntory_contents .enquete .enquete_container dl.comment_form {
	margin-bottom:25px;
}

#suntory_contents .enquete .enquete_container dt {
	margin-bottom:0;
	font-size:15px;
	font-weight:bold;
	line-height: 20px;
	color:#002A64;
	background:url(../img/enquete/q.svg) no-repeat 0 center;
	background-size:26px auto;
	padding-left:37px;
	letter-spacing:-0.05em;
	width:300px;
	height:20px;
	display: flex;
	align-items: center;
}
#suntory_contents .enquete .enquete_container dt.messege {
	background:none;
	padding:0;
	line-height:1.5;
	height:auto;
	flex-direction: column;
	align-items: flex-start;
}
#suntory_contents .enquete .enquete_container dd {
	width:580px;
}

#suntory_contents .enquete .enquete_container dd.option5,
#suntory_contents .enquete .enquete_container dd.option3 {
	display:flex;
	justify-content: space-between;
}
#suntory_contents .enquete .enquete_container input[type="radio"] {
	display:none;
}
#suntory_contents .enquete .enquete_container input[type="radio"] + label {
	background:#FCFAEA url(../img/enquete/icon_radio_off.svg) no-repeat 12px 8px;
	background-size:15px 15px;
	color: #002A64;
	font-size:15px;
	line-height:1.2;
	width:110px;
	height:30px;
	border-radius: 5px;
	display:flex;
	justify-content: flex-start;
	align-items:center;
	text-align: center;
	padding:0 0 0 35px;
}
#suntory_contents .enquete .enquete_container input[type="radio"]:checked + label {
	background:#FFDE66 url(../img/enquete/icon_radio_on.svg) no-repeat 12px 8px;
	background-size:15px 15px;
}
#suntory_contents .enquete .enquete_container .option3 input[type="radio"] + label {
	width:180px;
}
#suntory_contents .enquete .enquete_container .comment {
	margin:0;
	webkit-appearance: none;
	appearance: none;
	resize: none;
	outline: none;
	background: transparent;
	border:1px #CCCCCC solid;
	padding:10px;
	font-size:16px;
	width:580px;
	height:4em;
	box-sizing: border-box;
}
#suntory_contents .enquete .enquete_container .btn_submit {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	outline: none;
	background: transparent;
	width:320px;
	height:40px;
	border:1px #0058D1 solid;
	display:flex;
	align-items:center;
	justify-content: center;
	color: #0058D1;
	font-size:20px;
	font-weight:bold;
	border-radius:26px;
	margin:0 0 0 356px;
	cursor:pointer;
}
#suntory_contents .enquete .enquete_container .btn_submit:hover {
	background:#0058D1;
	color:#fff;
}

/*------------------------------------------------------------
enquete_done（PC）
------------------------------------------------------------ */
#suntory_contents .enquete_done {
	padding:75px 0;
}
#suntory_contents .enquete_done .text {
	margin-bottom:60px;
	font-size:30px;
	text-align: center;
	color:#002A64;
}
#suntory_contents .enquete_done .back2article {
	text-align: center;
}
#suntory_contents .enquete_done .back2article a {
	color: #0058D1;
	font-size:14px;
	text-decoration: underline;
	display:inline-block;
	background:url(../img/enquete/arrow_l_blue.svg) no-repeat 0 center;
	background-size:7px auto;
	padding-left:14px;
}
#suntory_contents .enquete_done .back2article a:hover {
	opacity:.75;
}


}