@charset "UTF-8";

/**********************************************************
 *
 * 満足度調査 改良版 SMT
 *
 **********************************************************/


/* animation */
@keyframes survey-bg-fadein {
0% {opacity: 0;}
100% {opacity: 0.8;}
}
@keyframes survey-main-fadein {
0% {opacity: 0;}
100% {opacity: 1;}
}
.mfp-bg.survey-mfp-fade{
opacity: 0;
animation: survey-bg-fadein 0.2s ease 0.4s forwards;
background-color: #505050;
}
.mfp-wrap.survey-mfp-fade{
opacity: 0;
animation: survey-main-fadein 0.2s ease 0.4s forwards;
}


/* layout
-------------------------------------------*/
#survey_questionnaire_block{
display: none;
margin: 25px 5px 70px 5px;
border-radius: 10px;
border: #EFEFEF 10px solid;color: #333;
}


/* button */
#survey_questionnaire_block .button{
pointer-events: none;
display: block;
padding: 0;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
appearance: none;
width: 16px;
height: 16px;
border: 1px solid #707070;
border-radius: 50%;
background-color: #fff;
cursor: pointer;
margin: 0;
}
#survey_questionnaire_block 
#survey_questionnaire_block .button:focus {
outline: dotted 1px black;
outline-offset: 1px;
border-radius: 20px;
}
#survey_questionnaire_block .button-label{
display: block;
width: 100%;
margin: 0 auto;
text-align: center;
color: #1d72e2;
font-size: 14px;
font-weight: bold;
line-height: 1.2;
padding-left: 26px;
}
#survey_questionnaire_block .button[type="radio"]::before{
content: "";
display: block;
width: 10px;
height: 10px;
margin: 2px;
border-radius: 50%;
background-color: transparent;
}
#survey_questionnaire_block .button[type="radio"]:checked::before{
background-color: #0a70f5;
}
#survey_questionnaire_block .survey_questionnaire_log--send .button-label{
padding: 7px 10px;
background: #0a70f5;
border-color: #0a70f5;
color: #FFF;
}
/* #survey_questionnaire_block .selected + .button-label{
background: #0a70f5 url(/images_osp/common/survey/check_mark.png) no-repeat right 14px center;
border-color: #0a70f5;
background-size: 10px 18px;
color: #FFF;
} */

#survey_questionnaire_block .survey-send-button{
display: block;
width: 118px;
margin: 0 auto;
padding: 7px 10px;
text-align: center;
color: #FFF;
background-color: #0a70f5;
border: #0a70f5 2px solid;
font-size: 14px;
font-weight: bold;
border-radius: 20px;
line-height: 1.2;
text-decoration: none;
}
#survey_questionnaire_block .survey-send-button.survey-send-button-disabled{
background-color: #757575;
border: #757575 2px solid;
pointer-events: none;
}
/* */


.survey_questionnaire_block--inner{
padding: 20px 0;
}
.survey_questionnaire_log--inner{
margin-bottom: 10px;
}
.survey_questionnaire_block--title{
display: block;
width: 90%;
margin: 0 auto 15px;
font-size: 14px;
font-weight: bold;
text-align: center;
}
.survey_questionnaire_block--title-inner{
display: inline-block;
text-align: left;
}
.survey_questionnaire_block--button-list{
text-align: center;
font-size: 0;
}
.survey_questionnaire_block--button-list li{
display: inline-flex;
margin: 0 30px 10px 30px;
align-items: center;
position: relative;
}

.survey_questionnaire_log--indicator-wrap{
position: relative;
}
.survey_questionnaire_log_q2--indicator{
width: 336px;
margin: 0 auto 3px auto;
background-color: #FFF;
border: #707070 2px solid;
border-radius: 28px;
box-sizing: content-box;
}
#survey_questionnaire_block .ui-state-default,
#survey_questionnaire_block .ui-widget-header .ui-state-default{
height: 28px;
width: 28px;
margin: 0;
border-radius: 28px;
}

#survey_questionnaire_block .ui-widget-content{
background: none;
}

#survey_questionnaire_block .ui-widget.ui-widget-content{
height: 28px;
width: 308px;
margin: 0;
border: none;
border-radius: 0;
font-family: 'Roboto';
}
#survey_questionnaire_block .ui-slider-horizontal .ui-slider-range-min{
padding-right: 14px;
background: #0a70f5;
border-radius: 28px 0 0 28px;
box-sizing: content-box;
}
#survey_questionnaire_block .ui-slider-handle,
#survey_questionnaire_block .ui-slider-handle:hover,
#survey_questionnaire_block .ui-slider-handle:focus{
background: none;
border: none;
outline: none;
}
#survey_questionnaire_block .ui-slider-handle{
top: 0;
z-index: 3;
}
#survey_questionnaire_block .ui-slider-handle .current-numerics{
display: none;
height: 28px;
width: 28px;
margin: 0;
background-color: #1d72e2;
color: #FFF;
border-radius: 28px;
font-size: 20px;
line-height: 1.2;
font-weight: bold;
cursor: pointer;
}
#survey_questionnaire_block .ui-slider-handle .current-numerics{
display: table;
}
#survey_questionnaire_block .ui-slider-handle .current-numerics em{
display: table-cell;
vertical-align: middle;
text-align: center;
font-weight: bold;
}
#survey_questionnaire_block .numerics-wrap{
position: relative;
/*width: 84vw;*/
font-size: 0;
white-space: nowrap;
z-index: 2;
}
#survey_questionnaire_block .numerics-wrap .numerics,
#survey_questionnaire_block .numerics-wrap .default-cursor{
display: inline-table;
height: 28px;
width: 28px;
margin: 0;
color: #707070;
font-size: 20px;
line-height: 1.2;
font-weight: bold;
vertical-align: top;
overflow: hidden;
}
#survey_questionnaire_block .numerics-wrap .numerics.active{
color: #FFF;
}
#survey_questionnaire_block .numerics-wrap .numerics em,
#survey_questionnaire_block .numerics-wrap .default-cursor em{
display: table-cell;
vertical-align: middle;
text-align: center;
font-weight: bold;
}
#survey_questionnaire_block .numerics-wrap .default-cursor em{
text-indent: -999px;
}

#survey_questionnaire_block .ui-slider-handle .current-numerics.default-cursor em,
#survey_questionnaire_block .numerics-wrap .numerics:first-child em{
background: url(/images_osp/common/survey/arrow_forward_white.png) no-repeat center center;
background-size: 15px;
text-indent: -999px;
}
#survey_questionnaire_block .survey-notes {
display: inline-block;
text-align: left;
margin-top: 6px;
}
#survey_questionnaire_block .survey-notes strong{
font-weight: bold;
color: #c03;
font-size: 12px;
}
#survey_questionnaire_block .ui-state-disabled .ui-slider-handle .current-numerics{
background-color: #757575;
}

.survey_questionnaire_log--guide{
width: 336px;
margin: 0 auto;
}
.survey_questionnaire_log--guide:after{
content: "";
display: block;
clear: both;
}
.survey_questionnaire_log--guide .txt-left{
float: left;
text-align: center;
font-size: 11px;
}
.survey_questionnaire_log--guide .txt-right{
float: right;
text-align: center;
font-size: 11px;
}
.survey_questionnaire_log--notes {
margin: 16px auto;
width: 90%;
text-align: center;
}

#survey_questionnaire_block .ui-state-disabled,
#survey_questionnaire_block .ui-widget.ui-widget-content.ui-state-disabled,
#survey_questionnaire_block .ui-widget-header .ui-state-disabled{
opacity: 1;
filter: none;
width: 336px;
background-color: #fff;
border-radius: 28px
}
#survey_questionnaire_block .ui-state-disabled .ui-slider-handle .current-numerics.default-cursor em{
display: none;
}

/* 促進後 */
.survey_questionnaire_block-promotion{
margin: 25px 5px 70px 5px;
border-radius: 10px;
border: #EFEFEF 10px solid;color: #333;
color: #333;
}
.survey_questionnaire_block-promotion--inner{
padding: 20px 0;
}
.survey_questionnaire-promotion--title{
display: block;
width: 90%;
margin: 0 auto 15px;
font-size: 14px;
font-weight: bold;
text-align: center;
}
.survey_questionnaire-promotion--txt{
margin: 16px auto;
width: 90%;
text-align: center;
}
.survey-open-popup-link{
display: block;
width: 170px;
margin: 0 auto;
padding: 7px 10px;
text-align: center;
color: #FFF;
background-color: #0a70f5;
border: #0a70f5 2px solid;
font-size: 14px;
font-weight: bold;
border-radius: 20px;
line-height: 1.2;
text-decoration: none;
}
/* 回答後 */
.survey_questionnaire_block-thanks{
margin: 25px 5px 70px 5px;
background-color: #EFEFEF;
border-radius: 10px;
color: #333;
}
.survey_questionnaire_block-thanks--inner{
padding: 40px 0;
}
.survey_questionnaire-thanks--title{
margin-bottom: 24px;
font-size: 18px;
text-align: center;
font-weight: bold;
}
.survey_questionnaire-thanks--txt{
width: 90%;
margin: 0 auto 16px;
font-size: 14px;
text-align: center;
}
.survey_questionnaire-thanks--txt-inner{
display: inline-block;
text-align: left;
}
.survey_questionnaire-thanks--notice{
width: 90%;
margin: 0 auto 20px;
font-size: 12px;
text-align: left;
}
.survey_questionnaire-thanks--notice:last-child{
margin-bottom: 0;
}
.survey_questionnaire-thanks--notice-item{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.survey_questionnaire-thanks--notice-item:before {
content: "\203b";
margin-right: 5px;
}
/* */

@media screen and (max-width: 359px){
	.survey_questionnaire_log_q2--indicator{
	width: 300px;
	}
	#survey_questionnaire_block .ui-state-disabled,
	#survey_questionnaire_block .ui-widget.ui-widget-content.ui-state-disabled,
	#survey_questionnaire_block .ui-widget-header .ui-state-disabled{
	width: 300px;
	}
	
	#survey_questionnaire_block .ui-widget.ui-widget-content{
	height: 25px;
	width: 275px;
	}
	#survey_questionnaire_block .ui-state-default,
	#survey_questionnaire_block .ui-widget-header .ui-state-default{
	height: 25px;
	width: 25px;
	}
	#survey_questionnaire_block .ui-slider-handle .current-numerics{
	height: 25px;
	width: 25px;
	font-size: 17px;
	}
	#survey_questionnaire_block .numerics-wrap .numerics{
	height: 25px;
	width: 25px;
	font-size: 17px;
	}
	.survey_questionnaire_log--guide{
	width: 300px;
	}
}