/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

body {
	padding-bottom: 0; /* no bottom padding, footer should be bottom aligned */
	padding-top: 40px;/* now is redefine in JS to fit any title length */
	flex-direction: column; /* article, then footer */
	display: flex; /* flex, to extend the content to full size */
	min-height: 100vh; /* full height, to bottom-align footer */
	font-size: 20px;
}
body > article {
	flex: 1; /* the main article should use as much space as possible */
}

/* Header */

.navbar {
	height: 40px;
	margin-top: 0;
	min-height: 40px;
	margin-bottom: 0;
	filter: drop-shadow( 0 2px 2px rgba(0,0,0,0.4));
}
.navbar-default {
	background: #3F3F3F url("../files/header_bg.png") repeat;
	border: none;
}
.navbar-default:after {
	content: " ";
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
	width: 40px;
	height: 40px;
	background: #3F3F3F url("../files/header_bg2.png") no-repeat;
}
/*  Header Logo */
.navbar-default .navbar-brand {
	font-size: 14px;
	color: #fff;
	padding: 6px 15px;
}
.navbar-default .navbar-brand:hover{
	color: #fff;
}
.navbar-brand {
	min-height: 1em;
}
.navbar-default .navbar-brand span {
	font-weight: bold;
	font-size: 130%;
}

/* Header Tools */

.firstPage .ls-index-menu{
	display: none;
}

.navbar-default .navbar-nav .dropdown-menu > li:first-child{
	display: none;
}

@media only screen and (min-width: 768px) {
.navbar-nav {
	z-index: 10;
	margin-top: 8px;
	margin-right: 40px;
}
.navbar-default .navbar-nav > li > a {
	color: #fff;
}
.navbar-default .navbar-nav > li > a:hover {
	color: #a0d8ef;
}
.navbar-nav > li > a {
	padding: 0 10px;
	line-height: 1em;
	font-size: 14px;
}
.ls-index-menu {
	color: #fff !important;
}
.navbar-nav > li > a {
	padding-top: 5px;
	padding-bottom: 0;
}
}

@media only screen and (max-width: 767px) {
.navbar-toggle {
	margin-top: 3px;
	margin-right: 40px;
	height: 1.4em;
	padding: 5px 10px;
}
.navbar-default .navbar-toggle .icon-bar {
	background-color: #ccc;
}
.navbar-collapse.in {
	background: rgba(255,255,255,0.9)
}
.navbar-nav > li {
	border-bottom: dotted 1px #666;
}
.navbar-nav > li:last-child {
	border-bottom: none;
}
.navbar-nav > li > a {
	font-size: 80%;
}
.dropdown-menu li {
	border-bottom: dotted 1px #666;
}
.dropdown-menu li:last-child {
	border-bottom: none;
}
}

/* コンテンツ部分の共通スタイル */
article h2 {
	background: #aadbff;
	padding: 0.3em 0.5em;
	font-size: 120%;
	font-weight: bold;
}
article h3 {
	padding: 5px;
	border-bottom: solid 5px #aadbff;
	font-size: 110%;
	font-weight: bold;
}
article h4 {
	padding-left: 1em;
	border-left: solid 5px #aadbff;
	font-size: 100%;
	font-weight: bold;
}
article p {
	line-height: 120%;
}

/* 左右 */
article .leftBox{
	float: left;
	padding-right: 0.5em;
}
article .righttBox{
	float: right;
}
article .righttBox:after{
	clear: both;
}

/* 横並び（flexBox） */
article .flexBox{
	width: 100%;
	display: flex;
	margin-top: 1em;
	justify-content: space-between;
	align-items: flex-start;
}

@media only screen and (max-width: 767.98px) {
	article .flexBox{
		display: block;
	}
	article .flexBox div{
		width: 100%!important;
		margin: 1em 0;
	}
	article .flexBox img{
		margin-top: 0;
	}
}

/* 枠線で囲う */
/*
	1.設問番号のテキストを選択してエディタの「DIVコンテナを作成」ボタンをクリック。
	2.「スタイルシートクラス」に「borderBox」と入力。
*/
article .borderBox{
	border: solid #ccc 1px;
	padding: 0.7em 1em;
	margin: 0 auto 1em auto;
}

article .borderBox.white{
	border: solid #fff 1px;
}

article .borderBox.skyblue{
	border: solid #00a1e9 1px;
}

article .borderBox.red{
	border: solid #ea5550 1px;
}

/* リスト */
#welcomeInner ol,
.question-title-container ol{
	padding: 0;
	list-style-position: inside;
}
#welcomeInner ol li,
.question-title-container ol li{
	position: relative;
	padding-left: 1em;
    text-indent: -1em;
	line-height: 1.5;
	margin: 0 auto;
	padding: 0.5em 0 0.5em 1.4em;
	border-bottom: dashed 1px #ccc;
}

#welcomeInner ul,
.question-title-container ul{
	padding: 0;
}
#welcomeInner ul li,
.question-title-container ul li{
	position: relative;
	line-height: 1.5;
	margin: 0 auto;
	padding: 0.5em 0 0.5em 1.4em;
	border-bottom: dashed 1px #ccc;
	list-style-type: none!important;
}
#welcomeInner ul li:before,
.question-title-container ul li:before{
	content: "●";
	position: absolute;
	left : 0.5em; 
	color: #45b0ce; 
}

/* YouTube動画 */
article .videodetector{
	position: relative;
	width: 80%;
	max-width: 990px;
	height: 0;
	padding-bottom: 45%; /* 高さ */
	overflow: hidden;
	margin: 10px auto;
}
article .videodetector iframe{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	margin:0 auto;
}

/* 引用 */
article blockquote{
	position: relative;
	border: solid 1px #ccc;
	borer-left: solid 5px #ccc;
	font-size: 90%;
}
article blockquote:before{
	display: inline-block;
	position: absolute;
	top: -0.3em;
	left: -0.3em;
	content: "\f10d";
	font-family: FontAwesome;
	color: #cfcfcf;
	font-size: 180%;
	line-height: 1;
	font-weight: 900;
}
article blockquote p{
	margin: 0;
}
article img,
article video{
	max-width: 100%;
	height: auto;
}

/* 改行のレスポンシブ対応 */
/*  */
@media screen and (min-width: 768px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}
@media screen and (max-width: 767px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
}

/* //////////////////////ようこそ画面////////////////////// */
#welcomeContainer {
	display: none;
}
.firstPage #welcomeContainer {
	display: block;
	width: 100%;
	margin: -20px 0 0 0;
	padding: 0;
}
.firstPage #welcomeInner h1, 
.firstPage #welcomeInner h2, 
.firstPage #welcomeInner h3, 
.firstPage #welcomeInner h4, 
.firstPage #welcomeInner p, 
.firstPage #welcomeInner ul, 
.firstPage #welcomeInner ol{
	width: 80%;
	max-width: 1200px;
	margin: 1em auto;
}
.firstPage #welcomeInner p {
	line-height: 130%;
}
.firstPage #welcomeInner blockquote{
	width: 70%;
	max-width: 1000px;
	margin: 1em auto;
}
.firstPage #welcomeInner blockquote p{
	width: 100%;
	padding: 0.5em 1em 0.5em 1.5em;
}

/* メイン画像　設定画面でdivで囲い、スタイルクラスに「mainImage」を指定すること */
/* 背景なしにする場合はスタイルクラスに「mainImage bg-noColor」を指定すること */
.firstPage #welcomeInner .mainImage p {
	width: 100% !important;
}
.firstPage #welcomeInner .mainImage p img {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	vertical-align: bottom;
}
/* デスクトップ（幅1200px以上）の場合メイン画面の背景あり */
@media only screen and (min-width: 768px)  {
	.firstPage #welcomeInner .mainImage p img {
		max-width: 1360px;
	}
	.firstPage #welcomeInner .mainImage {
		margin-bottom: 30px;
		background: #fff url("../files/gcq_main_bg.png") bottom center repeat-x;
		background-size: auto 100%;
	}
	.firstPage.bgNoColor #welcomeInner .mainImage {
		background-image: none;
	}
}

/* スマホ用 */
@media only screen and (max-width: 767.98px) {
	.firstPage #welcomeInner h1, 
	.firstPage #welcomeInner h2, 
	.firstPage #welcomeInner h3, 
	.firstPage #welcomeInner h4, 
	.firstPage #welcomeInner p, 
	.firstPage #welcomeInner ul, 
	.firstPage #welcomeInner ol,
	.firstPage #welcomeInner blockquote{
		width: 95%;
		margin: 1em auto;
	}
	.firstPage #welcomeInner blockquote{
		width: 80%;
		max-width: 1000px;
		margin: 1em auto;
	}
	.firstPage #welcomeInner blockquote p{
		width: 100%;
		padding: 0.5em 1em 0.5em 1.5em;
	}
	.firstPage .videodetector{
		width: 90%;
		padding-bottom: 56.25%;
	}
}

/*  地域IDをようこそ画面の右下付近に小さく表示  */
.areaID{
    text-align: right;
    font-size: 8px;
    color: #ccc;
    margin: 0 !important;
}

/* //////////////////////プログレスバー（進捗）////////////////////// */
/* 同意画面では非表示 */
.firstPage .top-container {
	display: none;
}
/* 女性用完了画面・非同意画面では非表示 */
.errorPage .top-container{
	display: none;
}
.top-container.space-col {
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.progress {
	margin: 10px auto;
	background-color: #E1E1E1;
}
.progress-bar {
	/*background: #7f7f7f;*/
	background-color: #8B8989;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #7f7f7f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #7f7f7f), color-stop(.75, #7f7f7f), color-stop(.75, transparent), to(transparent));
	-webkit-background-size: 14px 14px;
}
.top-container p.note{
	margin-top: 1rem;
	font-size: 70%;
	text-align: center;
}
@media only screen and (max-width: 991.98px){
	.top-container.space-col {
		width: 100%;
		position: fixed;
		top: 40px;
		margin: 0 auto;
		z-index: 999;
	}
}

/* //////////////////////フッター////////////////////// */
#ssl-message {
	/*flex: 1;*/
	margin-top: 2.5em;
	padding-bottom: 10px;
	text-align: center;
	font-size: 75%;
}
#footer {
	flex: 1;
	padding-top: 10px;
	background-color: #00B2EC;
	text-align: center;
	font-size: 85%;
	color: #fff;
}
/* //////////////////////コンテンツ部分のレイアウト////////////////////// */
/* タブレット, 768px 以上 */
@media only screen and (min-width: 768px){
	.container{
		width: 95%;
	}
	.firstPage .container{
		width: 90%;
	}
}

/* デスクトップ, 992px 以上 */
@media only screen and (min-width: 992px){
	.container{
		width: 95%;
	}
	.firstPage .container{
		width: 90%;
	}
}

/* タブレット横 */
@media only screen and (min-width: 1024px) and (orientation: landscape) {
	.container{
		width: 95%;
	}
	.firstPage .container{
		width: 90%;
	}
}

/* ワイド・デスクトップ, 1200px 以上 */
@media only screen and (min-width: 1200px){
	.container{
		width: 95%;
		max-width: 1200px;
	}
	.firstPage .container{
		width: 90%;
		max-width: 1200px;
	}
}


/* //////////////////////設問ページ////////////////////// */
#outerframeContainer.container {
	padding: 0;
}

/* ******設問グループ****** */
.group-outer-container {
	margin-bottom: 1em;
}
.group-container {
	margin-bottom: 0;
}
@media only screen and (max-width: 991.98px){
	#main-col{
		margin-top: 1em;
	}
}

/* 設問グループ名 */
.group-title{
	width: 80%;
	margin: 0 auto;
	background: #45b0ce;
	padding: 0.3em 0.5em;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
	border: none;
}
.firstPage .group-title{
	width: 95%;
	max-width: 1200px;
}
@media only screen and (max-width: 991.98px) {
	.group-title{
		width: 95%;
	}
}
/* タブレット横 */
@media only screen and (min-width: 1024px) and (orientation: landscape) {
	.group-title{
		width: 95%;
	}
}

/* 設問グループの説明 */
.group-description{
	width: 80%;
	margin: 0 auto;
	background: #d9f0ff;
	border: none;
}
.firstPage .group-description{
	width: 95%;
	max-width: 1200px;
}
@media only screen and (max-width: 991.98px){
	.group-description{
		width: 95%;
	}
}
/* タブレット横 */
@media only screen and (min-width: 1024px) and (orientation: landscape) {
	.group-description{
		width: 95%;
	}
}

/* ******設問の枠内全体****** */
.question-container.row {
	width: 80%;
	margin: 1.5em auto;
	border: 1px solid #ccc;
}
.firstPage .question-container.row{
	width: 95%;
}
@media only screen and (max-width: 991.98px){
	.question-container.row {
		width: 95%;
	}
}
/* タブレット横 */
@media only screen and (min-width: 1024px) and (orientation: landscape) {
	.question-container.row {
		width: 95%;
	}
}
/* ******設問文****** */
.question-title-container {
	background: #00B2EC;
	padding: 0.5em;
	color: #fff;
}
/* 設問番号 */
.question-number,
.question-code{
	line-height: 120%;
}
.question-number.text-muted,
.question-code.text-muted{
	padding-right: 0.8em;
	color: #19448e;
	font-weight: bold;
}
/* 休憩ページは設問番号非表示 */
.break-page .question-number,
.break-page .question-code,
.break-page .qBox{
	display: none;
}
/* 女性用完了画面・非同意画面は設問番号非表示 */
.errorPage .question-number,
.errorPage .question-code,
.errorPage .qBox{
	display: none;
}
/* 設問番号を設問文の中に入れる場合 */
/*
	1.設問番号のテキストを選択してエディタの「DIVコンテナを作成」ボタンをクリック。
	2.「スタイルシートクラス」に「qcode」と入力。
	3.改行して設問文を入力し、設問番号以外をすべて選択して「DIVコンテナを作成」ボタンをクリック。
	4.「スタイルシートクラス」に「qtext」と入力。
*/
.question-text .qBox{
	display: flex;
}
.question-text .qcode{
	padding-right: 0.8em;
	font-weight: bold;
	color: #19448e;
	white-space: nowrap;
}
.question-text .qtext {
	
}
.question-text .qtext strong{
	color: #fff352;
}
/*設問文*/
.ls-label-question p {
	margin: 0;
}
.ls-label-question img {
	margin-top: 5px;
}

/* 必須 */
.asterisk {
	display: inline-block;
	padding-left: 0.5em;
	font-size: 85%;
}
.input-error .asterisk{
	font-size: 85%;
}

/* ******テキストのみ****** */
/*
	設問設定画面の右メニュー「表示」の「CSSクラス」に「onlyText」を入力
*/
.onlyText.question-container {
	background: none;
	border: none;
	margin-bottom: 0;
}
.onlyText .question-container {
	background: none;
	border: none;
	margin-top: 0;
	margin-bottom: 0;
}
.onlyText .question-title-container {
	background: none;
	border: none;
	padding-left: 0;
	padding-right: 0;
}
.onlyText .question-text{
	background: #d9f0ff;
	padding: 1em 0.5em;
	color: #000;
}
.onlyText.noColor .question-text{
	background: #ffffff;
	padding-bottom: 0;
}

.onlyText .question-number,
.onlyText .question-code{
	display: none;
}
.onlyText h2 {
	width: 100%;
	padding: 0.8em 0.7em;
	background: #45b0ce;
	font-size: 110%;
	color: #fff;
}

.onlyText h3,
.onlyText h4,
.onlyText p,
.onlyText ul,
.onlyText ol{
	width: 90%;
	margin: 1em auto;
}

.onlyText li {
	margin-bottom: 0.3em;
}
.onlyText table {
	width: 80%;
	margin: 0.5em auto;
}
.onlyText th {
	padding: 0.2em;
}
.onlyText td {
	padding: 0.2em;
}
.onlyText blockquote {
	width: 80%;
	margin: 1.5em auto 1.5em auto;
}
.question-valid-container,
.question-help-container{
	margin-top: 5px;
	font-size: 80%;
}


/* ******回答欄****** */
.answer-container {
	padding-top: 1em;
	background: #fff;
}


/* ******ラジオボタン****** */
.radio-item label{
    width: 100%;
	padding-left: 10px;
}
.radio-item label::before{
	width: 1.2em;
	height: 1.2em;
	top: 1px;
	border: 1px solid #888;
}
.radio-item label::after{
	width: 0.8em;
	height: 0.8em;
	left: 4px;
	top: 5px;
}
.radio-item input[type="radio"]:checked + label::after{
	width: 0.8em;
	height: 0.8em;
	left: 4px;
	top: 5px;
	background: #01B2EC;
}
.radio-item label::after{
	background-color: #01B2EC;
}

.radio-item input[type="radio"]:focus + label::before{
	outline: none;
}

/* ******チェックボックス****** */
.checkbox-item label{
    width: 100%;
	padding-left: 15px;
}
.checkbox-item label::before{
	width: 1.1em;
	height: 1.1em;
	top: 2px;
	border: 1px solid #888;
}
.form-horizontal .checkbox-item label::before{
	top: 9px;
}
.checkbox-item label::after{
	width: 0.7em;
	height: 0.7em;
	top: 6px;
	left: 4px;
	font-size: 1em;
	color: transparent;
	background-color: #01B2EC;
}
.form-horizontal .checkbox-item label::after{
	top: 12px;
}
.checkbox-item input[type="checkbox"]:checked + label::after, 
.checkbox-item input[type="radio"]:checked + label::after{
	font-family: "FontAwesome";
	content: "\f00c";
}

.checkbox-item input[type="checkbox"]:focus + label::before{
	outline: none;
}

.control-label br + img{
	margin-top: 10px;
}

@media (min-width: 768px){
	.form-horizontal .control-label{
		text-align: left;
	}
}


/* ******ドロップダウン****** */
.form-control.list-question-select {
	margin: 0.3em auto 0.5em 0;
	font-size: 1em;
	height: auto;
}

/* ******テキストボックス****** */
/* ******テキストエリア****** */
.text-item .form-control,
.form-control.textarea{
	font-size: 1em;
	height: auto;
}
/* 左右のテキスト追加部分 */
@media (max-width: 481px){
	.ls-input-sized .ls-input-group{
		width: auto;
		max-width: 100%;
		display: table;
		table-layout: fixed;
		margin-top: 0.5em;
		margin-bottom: 0.5em;
	}
}

@media (max-width: 481px){
	.ls-input-sized .ls-input-group-extra{
		width: initial;
	}
}
@media (max-width: 481px){
	.ls-input-group-extra{
		width: 1%;
		white-space: nowrap;
		vertical-align: middle;
		display: table-cell;
		padding: 0.6rem 1.2rem;
		line-height: 1;
	}
}
@media (max-width: 481px){
	.dir-ltr .ls-input-group .form-control{
		float: left;
	}
}
@media (max-width: 481px){
	.ls-input-group .form-control{
		display: table-cell;
		margin-bottom: 0;
		position: relative;
		z-index: 2;
	}
}

/* ******その他のテキスト****** */
.otherText.question-container{
    /*position: relative;
    top: -3em;*/
    margin-top: -3em;
    background: none;
    padding-left: 1.5em;
    border-top: solid 1px #fff!important;
    background: #fff;
}

.otherText .question-title-container{
    width: 80%;
    background: none;
    border-left: solid #00B2EC 1px;
	border-bottom: solid #00B2EC 1px;
	color: #000;
}
.otherText .question-text .qcode{
	display: none;
}

@media screen and (min-width: 768px){

}
@media screen and (max-width: 767.9px){	
    .otherText .question-title-container{
         width: 95%;
    }
    .otherText .answer-container{
        width: 100%;
    }
    .question-container.row.otherText{
        margin-bottom: 0;
		padding-bottom: 1em;
    }
}

.otherText .answer-container{
    width: 80%;
    padding-top: 0;
}
@media screen and (max-width: 767.9px){	
    .otherText .answer-container{
        padding-top: 1em;
    }
}

/* ******地図表示****** */
.map-item.geoloc-item .form-inline{
	margin-bottom: 1em;
}

/* ******5点尺度（ラジオボタン）****** */
/*構造：
	div.choice-5-pt-radio 
		> div.answer-container 
		> ul.radio-list.list-unstyled.form-inline 
		> li.radio-item 
*/

.choice-5-pt-radio .ls-answers.form-inline{
	padding-left: 2em;
}

.choice-5-pt-radio .form-inline  li{
	width: 18%;
	margin-right: 0;
	padding-left: 0;
}

.choice-5-pt-radio .form-inline li.noanswer-item {
	width: 6em;
	display: block;
	text-align: left;
}
@media only screen and (max-width: 575.98px) {
	.choice-5-pt-radio .form-inline li.noanswer-item {
		width: 6em;
	}
} 

/* ******5点尺度（スター）****** */
/*構造：
	div.choice-5-pt-radio 
		> div.answer-container 
		> ul.radio-list.list-unstyled.form-inline.starred-list
			※このulはwidth・height1pxで実質非表示
		> li.radio-item 
	div.stars-list 実際に表示されているのはこちらのDIV
		> div.star-rating
		> div.fa-star
*/
/*.choice-5-pt-radio .ls-answers.form-inline.starred-list{
	display: flex;
}

.choice-5-pt-radio .form-inline.starred-list li.noanswer-item {
	width: 2em;
	display: inline;
	text-align: left;
}*/
.choice-5-pt-radio .star-cancel.star-rated-on{
	color: #a12424;
}

.choice-5-pt-radio .stars-list{
	width: 95%;
	display: flex;
}

.choice-5-pt-radio .stars-list .star-rating{
	width: 20%;
	text-align: center;
	font-size: 1.5em;
	line-height: 100%;
	cursor: pointer;
	display: block;
	float: none;
	height: 2em;
}
.choice-5-pt-radio .slider-label.slider-label-6 {
	font-size: 200%;
}

/* ******5点尺度（スライダー）****** */
/* jsファイルのパス
	スライダーの動作はjsファイルで調整
	SH-2020/assets/packages/questions/5pointchoice/slider-rating.js
*/
/*構造：
	div.choice-5-pt-radio
		> div.stars-list
		※実際に表示されているのはこちらのDIV
			> div#emoji_slider_container_906.slider-wrapper
			顔文字部分
				> div.slider-labels
				> div.slider-label
			スライダー部分
				> div#emoji_slider_grab_container_906.slider-grab-container
					> div#slider_line_item_906.slider-line.mandatory
			> div"slider_handle_item_906.slider-handle
*/

.choice-5-pt-radio #emoji_slider_container_906.slider-wrapper {
	margin: 3px auto 3px auto;
}
.choice-5-pt-radio .slider-line.mandatory{
	background: #888888;
}

@media only screen and (min-width: 768px){
	.choice-5-pt-radio .slider-wrapper{
		width: 560px;
	}
	.choice-5-pt-radio .slider-labels{
		width: 560px;
	}
	.choice-5-pt-radio .slider-label{
		width: 90px;
		text-align: center;
	}
	.choice-5-pt-radio .slider-grab-container{
		 width: 550px;
	}
	.choice-5-pt-radio .slider-line{
		width: 550px;
		background: #888;
	}
}
@media only screen and (max-width: 767.98px) {
	.choice-5-pt-radio .slider-wrapper{
		width: 320px;
	}
	.choice-5-pt-radio .slider-labels{
		width: 320px;
	}
	.choice-5-pt-radio .slider-label{
		width: 52px;
		text-align: center;
        font-size: 80%;
	}
	.choice-5-pt-radio .slider-grab-container{
		 width: 320px;
	}
	.choice-5-pt-radio .slider-line{
		width: 320px;
		background: #888;
	}
}

/* ******10点尺度****** */
/*構造：
	div.choice-10-pt-radio 
		> div.answer-container 
		> ul.radio-list.list-unstyled.form-inline 
		> li.radio-item 
*/
.choice-10-pt-radio .star-cancel.star-rated-on{
	color: #a12424;
}
.choice-10-pt-radio .ls-answers.form-inline{
	padding-left: 2em;
}

.choice-10-pt-radio .form-inline  li{
	width: 9%;
	margin-right: 0;
	padding-left: 0;
}

.choice-10-pt-radio .form-inline li.noanswer-item {
	width: 6em;
	display: inline-block;
	/*margin-left: 4%;*/
	text-align: left;
}
@media only screen and (max-width: 575.98px) {
	.choice-10-pt-radio .form-inline  li{
		width: 18%;
	}
	.choice-10-pt-radio .form-inline li.noanswer-item {
		width: 6em;
	}
} 

/* ******10点尺度（スター）****** */
/*構造：
	div.choice-5-pt-radio 
		> div.answer-container 
		> ul.radio-list.list-unstyled.form-inline.starred-list
			※このulはwidth・height1pxで実質非表示
		> li.radio-item 
	div.stars-list 実際に表示されているのはこちらのDIV
		> div.star-rating
		> div.fa-star
*/
.choice-10-pt-radio .stars-list{
	width: 95%;
	display: flex;
}

.choice-10-pt-radio .stars-list .star-rating{
	width: 20%;
	text-align: center;
	font-size: 1.5em;
	line-height: 100%;
	cursor: pointer;
	display: block;
	float: none;
	height: 2em;
}
@media only screen and (max-width: 767.98px) {
    .choice-10-pt-radio .stars-list{
        width: 100%;
    }
}

/* ******10点尺度（スライダー）****** */
/* jsファイルのパス
	スライダーの動作はjsファイルで調整
	SH-2020/assets/packages/questions/10pointchoice/slider-rating.js
*/
/*構造：
	div.choice-10-pt-radio
		> div.stars-list
		※実際に表示されているのはこちらのDIV
			> div#emoji_slider_container_906.slider-wrapper
			顔文字部分
				> div.slider-labels
				> div.slider-label
			スライダー部分
				> div#emoji_slider_grab_container_906.slider-grab-container
					> div#slider_line_item_906.slider-line.mandatory
			> div"slider_handle_item_906.slider-handle
*/

.choice-10-pt-radio #emoji_slider_container_906.tptslider-wrapper {
	margin: 3px auto 3px auto;
}
.choice-10-pt-radio .tptslider-line.mandatory{
	background: #888888;
}

@media only screen and (min-width: 768px){
	.choice-10-pt-radio .tptslider-wrapper{
		width: 650px;
        margin-left: auto;
        margin-right: auto;
	}
	.choice-10-pt-radio .slider-labels{
		width: 650px;
	}
	.choice-10-pt-radio .slider-label{
		width: 56px;
		text-align: center;
        font-size: 0.7em;
	}
	.choice-10-pt-radio .tptslider-grab-container{
		 width: 650px;
	}
	.choice-10-pt-radio .tptslider-line{
		width: 650px;
		background: #888;
        left: 0;
	}
}
@media only screen and (max-width: 767.98px) , (max-width: 639px){
    .choice-10-pt-radio .answer-container{
        padding: 2px;
    }
	.choice-10-pt-radio .tptslider-wrapper{
		width: 350px;
        height: 70px
	}
	.choice-10-pt-radio .slider-labels{
		width: 350px;
        margin: 1px 0;
	}
	.choice-10-pt-radio .slider-label{
		width: 31px;
		text-align: center;
        font-size: 55%;
	}
	.choice-10-pt-radio .tptslider-grab-container{
		 width: 350px;
	}
	.choice-10-pt-radio .tptslider-line{
		width: 350px;
		background: #888;
	}
    .choice-10-pt-radio .tptslider-handle{
        width: 13px;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
    }
}

/* 画像選択 */
.selectImage .ls-answers ul.list-unstyled{
    width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.selectImage .checkbox-item, 
.selectImage .radio-item {
	/*position: relative;
	display: inline-block !important;*/
	width: 30%;
	min-width: 149px;
	margin-right: 10px;
    padding-left: 0;
    text-align: center;
}

@media screen and (max-width: 767.9px){
	.selectImage .checkbox-item, 
	.selectImage .radio-item {
		width: 45%;
	}
}

.selectImage .checkbox-item label, 
.selectImage .radio-item label {
	box-sizing: border-box;
	padding-left: 0;
	border: solid 5px #fff;
}
.selectImage .checkbox-item input[type="checkbox"]:checked + label, 
.selectImage .radio-item input[type="radio"]:checked + label {
    width: 100%;
    height: 100%;
	box-sizing: border-box;
	border: solid 5px #ff0043;
}
.selectImage .checkbox-item label::before, 
.selectImage .radio-item label::before {
	visibility: hidden;
}
.selectImage .checkbox-item input[type="checkbox"]:enabled + label::before, 
.selectImage .radio-item input[type="radio"]:enabled + label::before,
.selectImage .checkbox-item input[type="checkbox"]:disabled + label::before, 
.selectImage .radio-item input[type="radio"]:disabled + label::before{
	visibility: hidden;
}
.selectImage .checkbox-item input[type="checkbox"]:checked + label::before, 
.selectImage .radio-item input[type="radio"]:checked + label::before {
	visibility: hidden;
}
.selectImage .checkbox-item input[type="checkbox"]:checked + label::after, 
.selectImage .radio-item input[type="radio"]:checked + label::after {
	visibility: hidden;
}
.selectImage .checkbox-item input[type="checkbox"]:enabled + label::after, 
.selectImage .radio-item input[type="radio"]:enabled + label::after,
.selectImage .checkbox-item input[type="checkbox"]:disabled + label::after, 
.selectImage .radio-item input[type="radio"]:disabled + label::after{
	visibility: hidden;
}
.selectImage .radio-item.no-anwser-item label{
	padding: 1em;
	background: #ccc;
}

/* ****** 複数選択（チェックボックス） ****** */

@media only screen and (max-width: 767.98px) {
	.form-horizontal .checkbox-item label::before {
		top: 0;
	}
	.form-horizontal .checkbox-item label::after {
		top: 0;
	}
}

/* ****** コメント付き複数選択 ****** */
@media only screen and (min-width: 768px){
	.checkbox-text-item .form-horizontal .control-label {
		text-align: left;
	}
}

/* ****** 配列 ****** */
/*
	div.array-flexible-row
	> div.answer-container
	> table.table-array-radio
*/

table.ls-answers{ 
	margin: 1em auto; 
	border: none;
}

table.ls-answers tbody .answertext{
	text-align: left;
}

/* ボーダー */
table.ls-answers>thead>tr>td,
table.ls-answers>thead>tr>th,
table.ls-answers>tbody>tr>td,
table.ls-answers>tbody>tr>th{
	border: none;
	border-bottom: solid #ccc 2px;
}
table.ls-answers>thead>tr>th,
table.ls-answers>tbody>tr>th,
table.ls-answers>thead>tr>td{ 
	border-right: solid #ccc 1px;
}
table.ls-answers>tbody>tr>td{ 
	border-right: dotted #ccc 1px;
}
table.ls-answers>thead>tr>th:last-child,
table.ls-answers>tbody>tr>td:last-child { 
	border-right: none;
}

/* 見出しセル */
table.ls-answers>thead>tr>td,
table.ls-answers>thead>tr>th { 
	background: #efefef;
	font-weight: normal;
	font-size: 95%;
}
table.ls-answers>tbody>tr>th{
	border-top: solid 2px #ccc;
}
table.ls-answers>thead>tr>th.dsheader,
table.ls-answers>tbody>tr>th{
	background: #eaf4fc;
	font-weight: bold;
	font-size: 95%;
}
table.ls-answers>tbody>tr>td.answertext{
	background: #eaf4fc;
	font-weight: bold;
	font-size: 95%;
}
table.ls-answers>tbody>tr>td{ 
	vertical-align: middle;
}
table.ls-answers .ls-heading > th{
	vertical-align: top;
}

/* 空のセル */
table.ls-answers thead .ls-heading th:empty,
table.ls-answers thead .ls-heading td:empty{
	background: none;
	border: none;
}

/* 二元スケールのスマホ表示 */
 @media (max-width: 767.98px) { 
	.array-flexible-duel-scale .ls-answers tbody .information-item{
		background: #EFEFEF;
		font-weight: bold;
	}
	 .array-flexible-duel-scale .ls-answers tbody .information-item.dual_scale_separator{
		background: none;
	 }
}

/* 二元スケールのセパレート部分 */
table.ls-answers thead .header_separator,
table.ls-answers tbody .dual_scale_separator{
	width: 5px;
	padding: 0;
	font-size: 1px;
	background: none;
	border-bottom: none;
}
table.ls-answers thead .header_separator div,
table.ls-answers tbody .dual_scale_separator div{
	width: 1px;
}

/* ラジオボタン・チェックボックスを大きく */
@media only screen and (min-width: 768px){
	table.ls-answers .radio-item .ls-label-xs-visibility, 
	table.ls-answers .checkbox-item .ls-label-xs-visibility{
		width: 1.2em;
		height: 1.3em;
	}
	.radio-item .ls-label-xs-visibility, 
	.checkbox-item .ls-label-xs-visibility {
		line-height: 1.2em;
		text-indent: 1.2em;
	}
}


/* タブレット */
@media only screen and (min-width: 768px) and (max-width: 991.98px) , (max-device-width: 1024px) and (min-device-width: 768px) {
	/* リスト形式ではなく表敬式で表示 */
	table.ls-answers{ 
		display: table; 
	}
	table.ls-answers.table-bordered{
		border: none;
	}
	table.ls-answers thead{ 
		display: table-header-group;
	}
	table.ls-answers tbody{ 
		display: table-row-group; 
	}
	table.ls-answers tr { 
		display: table-row;
	}
	table.ls-answers th{ 
		display: table-cell;
	}
	table.ls-answers td { 
		display: table-cell;
	}
	
	/* 見出しセルのテキストを中央揃え */
	.dir-ltr table.ls-answers thead,
	.dir-ltr table.ls-answers thead th,
	.dir-ltr table.ls-answers tbody td{
		text-align: center;
	}
	/* ラベル非表示 */
	table.ls-answers .ls-label-xs-visibility {
		display: inline-block;
		position: relative;
		overflow: hidden;
		line-height: 1.2em;
		text-indent: 1.2em;
		width: 1px;
		height: 1px;
		white-space: inherit;
	}
	.array-multi-flexi-text table.ls-answers .ls-label-xs-visibility{
		display: block;
	}
	.array-multi-flexi-text table.ls-answers td .form-control{
		margin-bottom: 5px;
	}
	table.ls-answers .radio-item .ls-label-xs-visibility, 
	table.ls-answers .checkbox-item .ls-label-xs-visibility{
		line-height: 1.3em;
		text-indent: 1.2em;
	}
	.dir-ltr table.ls-answers .radio-item .ls-label-xs-visibility, 
	.dir-ltr table.ls-answers .checkbox-item .ls-label-xs-visibility{
		margin-left: -20px;
	}
	.dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before, 
	.dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before{
		margin-left: 0;
	}
	.dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::after, 
	.dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::after{
		margin-left: 0;
	}
	table.ls-answers .ls-label-xs-visibility > *{
		 position: absolute;
		 top: auto;
		 width: 1px;
		 height: 1px;
		 overflow: hidden;
	}
	table.ls-answers td.visible-xs, table.ls-answers th.visible-xs{
		display: none !important; 
	}
	table.ls-answers .information-item:empty{
		display: block;
	}
	
}

/* スマホ */
@media only screen and (max-width: 767.98px), (max-device-width: 767.98px) {
	/* モバイルの時はリスト表示*/
	table.ls-answers,
	table.ls-answers thead,
	table.ls-answers tbody,
	table.ls-answers th, 
	table.ls-answers td,
	table.ls-answers tr {
		display: block; 
	}
	table.ls-answers thead{
		display: none;
	}
	/* リスト表示になるので改行なし */
	table.ls-answers>thead>tr>td br,
	table.ls-answers>thead>tr>th br,
	table.ls-answers>tbody>tr>td br,
	table.ls-answers>tbody>tr>th br{ 
		display: none;
	} 
}

/* ****** ファイルアップロード ****** */
.ls-answers.upload-item .question.uploadedfiles{
	margin-top: 1em;
}
.ls-answers.upload-item .question.uploadedfiles,
.ls-answers.upload-item .question.uploadedfiles thead,
.ls-answers.upload-item .question.uploadedfiles tbody,
.ls-answers.upload-item .question.uploadedfiles th, 
.ls-answers.upload-item .question.uploadedfiles td,
.ls-answers.upload-item .question.uploadedfiles tr {
	display: block; 
}
.ls-answers.upload-item .question.uploadedfiles thead{
	display: none;
}
.ls-answers.upload-item .question.uploadedfiles tr {
	border-bottom: solid #ccc 1px;
	padding: 0.5em 0;
}
.ls-answers.upload-item .question.uploadedfiles td{
	padding: 0.5em 0;
	text-align: left;
	border-bottom: solid #ccc 1px;
}
.ls-answers.upload-item .question.uploadedfiles .upload.image{
	text-align: center;
}
.ls-answers.upload-item .question.uploadedfiles .upload.image img{
	max-width: 200px;
}
.ls-answers.upload-item .question.uploadedfiles .upload.title{
	text-align: left;
}
.ls-answers.upload-item .question.uploadedfiles .title:before{
	display: block;
	content: "題名：";
	font-weight: bold;
}
.ls-answers.upload-item .question.uploadedfiles .upload.comment{
	text-align: left;
}
.ls-answers.upload-item .question.uploadedfiles .comment:before{
	display: block;
	content: "コメント：";
	font-weight: bold;
}
.ls-answers.upload-item .question.uploadedfiles .upload.edit{
	text-align: left;
}
.ls-answers.upload-item .question.uploadedfiles .edit:before{
	display: block;
	content: "ファイル名：";
	font-weight: bold;
}
/* ****** 休憩ページ ****** */
/*
.breakPage > .break-page
	１．質問タイプで「Usage Pages」の「テキスト表示」を選択
	２．右側メニューの「質問テンプレート」に「Break Page」を選択
	３．右側メニューの「CSSクラス」に「break-page」と入れる
		全画面にしたい時は「break-page full-page」と入れる
	４．bodyに.breakPageが追加される。
*/

.breakPage .question-title-container{
	background: #fff;
}

.breakPage .question-container{
	border: none;
	background: #fff;
}

.breakPage-text{
	color      : #000000;
}

/* 全画面表示 */
.breakPage.fullPage .question-container.row,
.breakPage.fullPage .group-title,
.breakPage.fullPage .group-description{
	width: 100%;
}
@media only screen and (min-width: 768px){
	.breakPage.fullPage .container{
		width: 100%;
	}
}
@media only screen and (min-width: 992px){
	.breakPage.fullPage .container{
		width: 100%;
	}
}
@media only screen and (min-width: 1200px){
	.breakPage.fullPage .container {
		width: 100%;
		max-width: 100%;
	}
}

.txt_box{
  position   : absolute;
  display    : inline-block;
  padding    : 20px;
  background : rgba(153, 97, 3, 0.7);          /* 半透明の青 */
  color      : #fff;
  top        : 50%;                               /* 中央寄せ */
  left       : 50%;
  transform  : translate(-50%,-50%);
}

/* ****** 次へボタン ****** */
#navigator-container {
	width: 95%;
	padding-bottom: 0;
	marginm: 1em auto;
}
.navigator {
	margin: 1em 0;
}
.ls-button-previous{
	padding-left: 2.5em;
	padding-right: 2.5em;
}
.ls-move-next-btn {
	padding-left: 2.5em;
	padding-right: 2.5em;
}

.btn-primary{
	background: #008DDD;
	border-color:  #008DDD;
}

.btn-primary:hover,
.btn-primary:focus{
	background: #008DDD;
	border-color:  #008DDD;
}

/* //////////////////////確認画面////////////////////// */

.kakuninPage h2{
	display: none;
}

.kakuninPage h3{
	border-color: #45B0CE;
}

.kakuninPage .question-code{
	display: none;
}

.kakuninPage .question-container.row{
	border: none;
}

/* 1ページめ（同意画面）は非表示 */
.kakuninPage .answer-container .groupSection.noKakunin{
	display: none;
}

/* 設問文 */
.kakuninPage .questiontext{
	padding:0.5em;
	border-left: solid 5px #aadbff;
	background: #efefef;
}
.kakuninPage .qid{
	display: none;
}
.kakuninPage .qtype{
	margin-top: 0.5em;
	font-size: 80%;
	color: #ccc;
}
.kakuninPage .sub-questionBox{
	margin-left: 0.2em;
}
.kakuninPage .sub-questiontext{
	padding-left: 0.3em;
	border-left: solid 5px #aadbff;
	border-bottom: solid 1px #aadbff;
}
.kakuninPage .sub-answertext{
	padding-top: 0.3em;
	padding-left: 0.5em;
}
	border: none;
}

.kakuninPage .boilerplateBox .questiontext{
	padding:0;
	border-left: none;
	background: #fff;
}

/* 回答文 */
.kakuninPage .question-container-printanswers{
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: dotted #ccc 2px;
}
.kakuninPage .answertext{
	padding-top: 0.5em;
	padding-left: 1.5em;
}
.kakuninPage .answer-list-dropdown .answervalue,
.kakuninPage .answer-list-radio .answervalue{
	display: none;
}
/* コメント欄 */
.kakuninPage .answertext .comment-title{
	padding-left: 0.3em;
	border-left: solid 3px #aadbff;
	font-size: 90%;
	color: #888;
}

.kakuninPage .answertext .comment{
	text-indent: 1em;
}

.kakuninPage .answertext.text-break-pre{
	white-space: normal;
}
/* 複数回答 */
.kakuninPage .multiple-answertext{
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: dotted 1px #ccc;
}
.kakuninPage .multiple-answertext:last-child{
	border-bottom: none;
}
.kakuninPage .multiple-img{
	display: flex;
	flex-wrap: wrap;
}
.kakuninPage .multiple-img .multiple-answertext{
	width: 50%;
	border-bottom: none;
	text-align: center;
}

/* 配列 */
.kakuninPage .array-answerBox{
	margin-top: 0.3em;
}
.kakuninPage .array-answerBox tr:last-child{
	border-bottom: 1px solid #ddd;
}
.kakuninPage .array-answerBox th{
	background: #eaf4fc;
	vertical-align: middle;
	font-weight: normal;
	border-right: dotted #ccc 1px;
}
.kakuninPage .array-answerBox td{
	vertical-align: middle;
	border-right: dotted #ccc 1px;
}
.kakuninPage .array-answerBox th br,
.kakuninPage .array-answerBox td br{
	display: none;
}
.kakuninPage .array-answerBox .colname{
	display: none;
}
/* ファイルアップロード */
.kakuninPage .answer-upload-files .comment-text{
	padding-bottom: 0.5em;
}
@media only screen and (max-width: 767.98px), (max-device-width: 767.98px) {
	/* モバイルの時はリスト表示*/
	.kakuninPage .array-answerBox,
	.kakuninPage .array-answerBox thead,
	.kakuninPage .array-answerBox tbody,
	.kakuninPage .array-answerBox th, 
	.kakuninPage .array-answerBox td,
	.kakuninPage .array-answerBox tr {
		display: block; 
	}
}
/* ランキング */
.kakuninPage .answer-ranking .answervalue{
	display: none;
}
.kakuninPage .answer-ranking .ranking-answertext{
	padding-top: 0.5em;
	border-bottom: dotted #ccc 2px;
}
.kakuninPage .answer-ranking .rankedvalue{
	padding: 0.5em 0.5em 0.5em 1.3em;
}

/* チェックマーク */
.kakuninPage .question-container-printanswers .fa-check-square-o:before{
	text-align: right;
}
/* チェックマーク */
.kakuninPage .answer-array-increase-same-decrease .fa-arrow-alt-circle-up:before{
	content: "\f35b";
}

/* 確認画面に表示したくない質問 */
/* 設問設定の表示 ＞ CSSクラスに「no-kakunin」と入力 */

.kakuninPage .no-kakuninBox{
	display: none;
}


/* //////////////////////完了画面////////////////////// */


.completedPage #outerframeContainer.container {
	margin-top: 2em;
}

 @media (max-width: 767.98px) {
	.completedPage #outerframeContainer.container {
		margin-top: 0;
	}
	.alert-warning {
		margin-top: 0;
	}
} 


.completedPage .completed-text {
	width: 95%;
	margin: 1em auto;
}

.completedPage .thanksBox{
	text-align: center;
}

.completedPage .thanksBox h2{
	padding: 0.3em;
	text-align: center;
}

.float-center {
    text-align: center;
    padding-top: 1em;
}


/* クーポン番号 */
.completedPage .couponNumber {
	margin-top: 1em;
	padding: 1.5em 1em;
	border: solid 4px #ea5506;
	text-align: center;
	font-size: 130%;
	font-weight: bold;
}
.completedPage .couponNumberText {
	font-size: 180%;
	color: #ea5506;
}
@media (max-width: 767.98px) {
	.completedPage .couponNumber {
		margin-top: 1em;
		margin-bottom:1em;
		padding: 0.5em;
	}
	.completedPage .couponNumberText {
		display: block;
		margin: 0.5em 0;
		color: #ea5506;
	}
} 


/* クーポン利用ボタンを表示する場合ここから
　クーポン利用ボタンを表示しない場合はコメントアウト 
.completedPage .couponButton{
	margin-top: 2em;
	text-align: center;
}
.completedPage .couponMessage{
	font-weight: bold;
}
.completedPage .couponMessage strong{
	color: #ea5506;
}
.completedPage .btn-primary{
	background-color: #990000;
	border-color: #990000;
	font-size: 1.2em;
	font-weight:bold;
}
.completedPage .btn-primary:focus, 
.completedPage .btn-primary:hover{
	background-color: #cc3333;
	border-color: #cc3333;
}
.completedPage .btn.disabled,
.completedPage .btn[disabled],
.completedPage fieldset[disabled] .btn{
	background-color: #71686c;
	border-color: #71686c;
	opacity: 1;
}*/
/* クーポン利用ボタンを表示する場合ここまで */

/* クーポン利用ボタンを表示しない場合ここから */
/* クーポン利用ボタンを表示する場合はコメントアウト */

.completedPage .couponButton{
	display: none;
}

/* クーポン利用ボタンを表示しない場合ここまで */

/* //////////////////////アラート////////////////////// */

.alert-warning {
	width: 80%;
	max-width: 1000px;
	margin: 10px auto;
	background: #efefef;
	border-color: #FF6700;
	color: #f00;
	font-size: 90%;
}
.firstPage .alert-warning {
	width: 95%;
	max-width: 1200px;
}

@media only screen and (max-width: 991.98px){
	.alert-warning {
		width: 95%;
		margin-top: 50px;
	}
}
/* //////////////////////エラー////////////////////// */
/* ポップアップの位置 */
@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px){
	.modal:before{
		height: auto!important;
	}
	.modal.in .modal-dialog{
		margin-top: 5em!important;
	}
}

.question-valid-container .text-danger{
	padding-bottom: 0.8em;
}

/* ポップアップの位置 */
@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px){
	#block_error{
		 width: 100%!important;
		 margin: 30px auto 0!important;
	}
	#block_error div{
		padding: 80px 10px 0 70px!important;
	}
	#block_error h2{
		padding: 0.5em;
		font-size: 120%;
		background: transparent;
	}
	#block_error p{
		font-size: 90%;
	}
}

/* //////////////////////アンケート中断画面////////////////////// */

.return-to-survey{
	width: 90%;
	margin: 3em auto 1em auto;
}
.return-to-survey .ls-return {
	border: solid 1px #337ab7;
}