@charset "UTF-8";

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


/* 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;
}
#survey_questionnaire_block *{
box-sizing: border-box;
}
#survey_questionnaire_block fieldset{
border: none;
margin: 0;
padding: 0;
}
#survey_questionnaire_block{
width: 940px;
margin: 25px auto 70px;
border: #EFEFEF 10px solid;
border-radius: 10px;color: #333;
background-color: #FFF;
}


/* button */
#survey_questionnaire_block .button{
display: block;
padding: 0;
border: 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 .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 .button:focus {
outline: dotted 1px black;
outline-offset: 1px;
border-radius: 20px;
}
#survey_questionnaire_block .button-label{
text-align: center;
color: #1d72e2;
font-size: 14px;
font-weight: bold;
border-radius: 20px;
line-height: 1.2;
width: 100%;
padding-left: 26px;
}
#survey_questionnaire_block .button-label:hover{
text-decoration: underline;
}
#survey_questionnaire_block .button:disabled + .button-label,
#survey_questionnaire_block .button:disabled + .button-label{
background-color: #757575;
border-color: #757575;
color: #FFF;
cursor: default;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
}
#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,
#survey_questionnaire_block .selected + .button-label:hover{
/* background: #0a70f5 url(/images_osp/common/survey/check_mark.png) no-repeat right 14px center;
border-color: #0a70f5;
background-size: 10px 18px;
color: #FFF;
-webkit-box-shadow: none;
box-shadow: none; */
text-decoration: none;
}

#survey_questionnaire_block .survey-send-button{
position: relative;
display: block;
width: 200px;
margin: 0 auto;
padding: 7px 10px;
text-align: center;
color: #0a70f5;
border: #0a70f5 2px solid;
font-size: 14px;
font-weight: bold;
border-radius: 20px;
line-height: 1.2;
text-decoration: none;
overflow: hidden;
pointer-events: auto;
transition: all .35s;
}
#survey_questionnaire_block .survey-send-button:after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #0a70f5;
  transition: all .35s;
}
#survey_questionnaire_block .survey-send-button span{
  position: relative;
  z-index: 1;
}
#survey_questionnaire_block .survey-send-button:hover,
#survey_questionnaire_block .survey-send-button:focus{
  color: #FFF;
}
#survey_questionnaire_block .survey-send-button:hover:after,
#survey_questionnaire_block .survey-send-button:focus:after{
  width: 100%;
}
#survey_questionnaire_block .survey-send-button.survey-send-button-disabled{
background-color: #757575;
border: #757575 2px solid;
pointer-events: none;
color: #FFF;
}
/* */


/* radio buttons */
.survey_questionnaire_log_q2--select{
margin: 0;
padding: 0;
font-size: 0;
font-family: 'Roboto';
text-align: center;
}
.survey_questionnaire_log_q2--select li{
display: inline-block;
vertical-align: top;
margin: 0 0 0 7px;
}
.survey_questionnaire_log_q2--select li:first-child{
margin-left: 0;
}
.survey_questionnaire_log_q2--select li label{
display: table;
width: 40px;
height: 40px;
background-color: #FFF;
border: #707070 1px solid;
border-radius: 6px;
color: #707070;
font-size: 18px;
line-height: 1.2;
cursor: pointer;
}
.survey_questionnaire_log_q2--select li input[type="radio"]:not(:checked) + label:hover{
border-color: #1d72e2;
color: #1d72e2;
}
.survey_questionnaire_log_q2--select li input[type="radio"]:disabled + label,
.survey_questionnaire_log_q2--select li input[type="radio"]:disabled + label:hover{
background-color: #FFF;
border-color: #707070;
color: #707070;
cursor: default;
}
.survey_questionnaire_log_q2--select li label em{
display: table-cell;
vertical-align: middle;
text-align: center;
font-weight: bold;
font-style: normal;
}
.survey_questionnaire_log_q2--select input[type="radio"]{
appearance: none;
opacity: 0;
}
.survey_questionnaire_log_q2--select input[type="radio"]:checked + label{
background-color: #1d72e2;
border-color: #1d72e2;
color: #FFF;
}
/* */


.survey_questionnaire_block--inner{
padding: 40px 100px;
}
.survey_questionnaire_log--inner{
margin-bottom: 20px;
}
.survey_questionnaire_block--title{
display: block;
width: 100%;
margin-bottom: 20px;
font-size: 18px;
font-weight: bold;
text-align: center;
}
.survey_questionnaire_block--button-list{
text-align: center;
font-size: 0;
margin: 0;
padding: 0;
}
.survey_questionnaire_block--button-list li{
display: inline-flex;
align-items: center;
margin: 0 60px 20px 60px;
padding: 0;
position: relative;
}

.survey_questionnaire_log--indicator-wrap{
position: relative;
margin-bottom: 20px;
}
.survey_questionnaire_log_q2--indicator{
width: 520px;
margin: 0 auto;
}
#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: 16px;
}
.survey_questionnaire_log--guide .txt-left{
position: absolute;
left: 0;
top: 0;
text-align: center;
}
.survey_questionnaire_log--guide .txt-right{
position: absolute;
right: 0;
top: 0;
text-align: center;
}
.survey_questionnaire_log--notes{
margin: 16px auto;
width: 100%;
text-align: center;
}

/* 促進後 */
.survey_questionnaire_block-promotion{
width: 940px;
margin: 25px auto 70px;
border: #EFEFEF 10px solid;
border-radius: 10px;
color: #333;
background-color: #FFF;
}
.survey_questionnaire_block-promotion--inner {
padding: 40px 100px;
}
.survey_questionnaire-promotion--title{
display: block;
width: 100%;
margin-bottom: 20px;
font-size: 18px;
font-weight: bold;
text-align: center;
}
.survey_questionnaire-promotion--txt{
margin: 16px auto;
width: 100%;
text-align: center;
}

.survey_questionnaire_block-promotion .survey-open-popup-link {
position: relative;
display: block;
width: 200px;
margin: 0 auto;
padding: 7px 10px;
text-align: center;
color: #0a70f5;
border: #0a70f5 2px solid;
font-size: 14px;
font-weight: bold;
border-radius: 20px;
line-height: 1.2;
text-decoration: none;
overflow: hidden;
pointer-events: auto;
transition: all .35s;
}
.survey_questionnaire_block-promotion .survey-open-popup-link:after{
content: "";
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: #0a70f5;
transition: all .35s;
}
.survey_questionnaire_block-promotion .survey-open-popup-link span {
position: relative;
z-index: 1;
}
.survey_questionnaire_block-promotion .survey-open-popup-link:hover,
.survey_questionnaire_block-promotion .survey-open-popup-link:focus{
color: #FFF;
}
.survey_questionnaire_block-promotion .survey-open-popup-link:hover:after,
.survey_questionnaire_block-promotion .survey-open-popup-link:focus:after{
width: 100%;
}
/* 回答後 */
.survey_questionnaire_block-thanks{
width: 940px;
margin: 25px auto 70px;
border-radius: 10px;
color: #333;
background-color: #EFEFEF;
}
.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;
}
/* */