@charset "utf-8";
/* CSS Document */

.B	{ font-weight:bold; }

.text_blue {
	color: #004899;    
}

.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
}

*, *:before, *:after {
	box-sizing: border-box;
}
.col_3rd {
	width: 100%;
	max-width: 1100px;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	margin-top: 10px;
	margin-bottom: 20px;
}
.col_3rd > div {
	width: 25%;
	padding: 10px;
}


.img3rd_adjustment {
	padding-top: 20px;
	padding-bottom: 20px;
}

.txtnagare {
	margin-top: -20px;
}
.txtnagare2 {
	margin-top: 0px;
	background-color: #004899;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.area5 {

	padding-top: 50px;
	padding-bottom: 0px;
	background-repeat: repeat;
	background-position: left bottom;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
	display: block;
}

.area6 {
	padding-top: 30px;
	padding-bottom: 0px;
	padding-left: 20px;
	padding-right: 20px;
}

.area7 {
	width: 100%;
	padding-top: 0px;
	padding-bottom: 5px;
}

.area10 {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
}

.area11 {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
}

.area8 {
	padding-top: 20px;
	padding-bottom: 40px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
}

.area9 {
	padding-top: 0px;
	padding-bottom: 30px;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: -40px;
}

.block-none2 {
	display: block;
	width: 100%;
	max-width: 1080px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
}

.mikiback {
	width: 100%;
	max-width: 1100px;
}

.quizback {
	width: 100%;
	max-width: 1100px;
}


*, *:before, *:after {
	box-sizing: border-box;
}
.col_douga {
	width: 100%;
	max-width: 1100px;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	margin-top: 10px;
	margin-bottom: 20px;
}
.col_douga > div {
	width: 50%;
	padding-right: 10px;
	padding-left: 10px;
}


.yellowstar {
	background-image: url(../images/bg_yellowstar.png);
	background-repeat: repeat;
	padding-top: 40px;
	padding-bottom: 40px;
}

#container-douga {
	width: 100%;
	max-width: 1100px;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.elements {
	width: 50%;
	padding-right: 10px;
	padding-left: 10px;
	text-align: center;
	padding-bottom: 20px;
}

.elements2 {
	width: 100%;
	padding-right: 10px;
	padding-left: 10px;
	text-align: center;
	padding-bottom: 20px;
}

.container2 .side.orange {
	background-color: #5aa905;
}

.container2 .side.orange.newline {
	height: 80px;
	line-height: 150%;
}
.container2 .side.pink {
	background-color: #f54885;
}

.container2 .side.pink.newline {
	height: 80px;
	line-height: 150%;
}

.container2 .side.yellow {
	background-color: #ffbd63;
	color: #000;
}

.container2 .side.yellow.newline {
	height: 80px;
	line-height: 150%;
}

.flexiblebox3 {
    margin-top: auto;
    margin-bottom: auto;
    vertical-align: middle;
    display: flex;
    align-items: center;
}

.orangeback.whiteback {
	background-color: #fff;
	border: 2px solid #a1a1a1;
}

.inq_comment {
	width: 100%;
	max-width: 1100px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
  }
.inq_comment_txt {
	display: inline-block;
	text-align: left;
	font-weight: bold;
  }


.inq_comment_txt .indent-1 {
	font-weight: normal;
  }

@media screen and (min-width: 768px) {
.area7 {
	background-image: url(../images/mikiback_bg.png);
	background-repeat: repeat-x;
	background-position: bottom;
}
}

@media screen and (min-width: 768px) {
.area10 {
	background-image: url(../images/quizback_bg.png);
	background-repeat: repeat-x;
	background-position: bottom;
}
}

@media screen and (min-width: 768px) {
.area11 {
	background-image: url(../images/answerback_bg.png);
	background-repeat: repeat-x;
	background-position: bottom;
}
}

@media screen and (max-width: 650px) {
 .col_3rd > div {
 width: 50%;
 padding: 6px;
}
.col_douga {
	margin-top: 0px;
	margin-bottom: 20px;
}
 .col_douga > div {
 width: 50%;
	padding-right: 6px;
	padding-left: 6px;
}
}

@media screen and (max-width: 767px) {
.img3rd_adjustment{
	padding-top: 0px;
	padding-bottom: 0px;
}
.txtnagare {
	margin-top: 0px;
}
.txtnagare2 {
	margin-top: 15px;
	padding-top: 15px;
	padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 10px;
}
.area5 {
	padding-top: 30px;
	padding-bottom: 0px;
}
.area6 {
	padding-top: 20px;
	padding-bottom: 0px;
}
.area7 {
	padding-top: 20px;
	padding-bottom: 20px;
}
.area10 {
	padding-top: 20px;
	padding-bottom: 30px;
}
.area11 {
	padding-top: 20px;
	padding-bottom: 30px;
}
.area7.sec {
	padding-bottom: 0px;
}

.area10.sec {
	padding-bottom: 0px;
}

.area11.sec {
	padding-bottom: 0px;
}

.area8 {
	padding-top: 10px;
	padding-bottom: 0px;
}
.area9 {
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 0px;
}
.yellowstar {
	padding-top: 30px;
	padding-bottom: 30px;
}
.elements {
	padding-top: 10px;
	padding-bottom: 10px;
}
.container2 .side.orange.newline {
	height: 30px;
}
}


p[class^="soundBtn"] {
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
}



 
 
.map_link {
  position: relative;
  max-width: 1100px;
  width: 100%;
	padding-left: 20px;
	padding-right: 20px;
  }
  
.area2.maparea {
	padding-left: 0px;
	padding-right: 0px;
}

.map_link p {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
	padding-left: 20px;
	padding-right: 20px;
  }

.map_link01 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 32%;
	margin-left: 45.5%;
}

.map_link02 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 54%;
	margin-left: 35.5%;
}

.map_link03 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 63.5%;
	margin-right: 5.5%;
}

.map_link04 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 77.4%;
	margin-right: 5.5%;
}

.map_link05 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 59.2%;
	margin-right: 40%;
}

.map_link06 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 77.6%;
	margin-right: 38.8%;
}

.map_link07 {
	position: relative;
	z-index: 2;
	width: 13%;
	margin-top: 74%;
	margin-left: 52%;
}
 

/*-------------ボタン-----------------*/

.lity-container2 {
	display: flex;
	max-width: 1080px;
}
.lity-container2 .side {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container2 .contents {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container2 img {
	max-width: 380px;
	margin-top: 20px;
	margin-bottom: 15px;
}
 @media (max-width: 767px) {
.lity-container2 {
 display: block;
 width: 100%;
 padding-top: 10px;
}
.lity-container2 .side {
 width: 86%;
 padding-right: 7%;
 padding-left: 7%;
}
.lity-container2 .contents {
 width: 86%;
 margin-top: 10px;
 padding-right: 7%;
 padding-left: 7%
}
.lity-container2 img {
 max-width: 320px;
}
}
 @media (max-width: 500px) {
.lity-container2 img {
 max-width: 100%;
}
}

/*-------------ボタン4-----------------*/

.lity-container4 {
	display: flex;
	max-width: 1080px;
}
.lity-container4 .side {
	width: 530px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container4 .contents {
	width: 530px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container4 img {
	max-width: 530px;
	margin-top: 20px;
	margin-bottom: 15px;
}
 @media (max-width: 767px) {
.lity-container4 {
 display: block;
 width: 100%;
 padding-top: 10px;
}
.lity-container4 .side {
 width: 86%;
 padding-right: 7%;
 padding-left: 7%;
}
.lity-container4 .contents {
 width: 86%;
 margin-top: 10px;
 padding-right: 7%;
 padding-left: 7%
}
.lity-container4 img {
 max-width: 320px;
}
}
 @media (max-width: 500px) {
.lity-container4 img {
 max-width: 100%;
}
}


/*-------------ボタンquiz---------------*/

.lity-container3 {
	display: flex;
	max-width: 930px;
}
.lity-container3 .side {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container3 .contents {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.lity-container3 img {
	max-width: 380px;
	margin-top: 20px;
	margin-bottom: 15px;
}
 @media (max-width: 767px) {
.lity-container3 {
 display: block;
 width: 100%;
 padding-top: 10px;
}
.lity-container3 .side {
 width: 86%;
 padding-right: 7%;
 padding-left: 7%;
}
.lity-container3 .contents {
 width: 86%;
 margin-top: 10px;
 padding-right: 7%;
 padding-left: 7%
}
.lity-container3 img {
 max-width: 320px;
}
}
 @media (max-width: 500px) {
.lity-container3 img {
 max-width: 100%;
}
}

/*-------------開閉ボタン-----------------*/

/*ボックス全体*/
.accbox {
    margin: 10px 0 10px 0;
    padding: 0;
    max-width: 1077px;/*最大幅*/
}

/*ラベル*/
.accbox label {
    display: block;
    margin: 1.5px 0;
    border: 2px solid #ccc;
}

/*ラベルホバー時*/
.accbox label:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
}

/*チェックは隠す*/
.accbox input {
    display: none;
}

/*中身を非表示にしておく*/
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.cssacc:checked + label + .input {
    display: none;
}


/*-------------ファイナルステージ-----------------*/

.center-block {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
}

.center-block img {
	width: 100%;
    max-width: 999px;
}

.pink-block {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
	background-image: url(../images/pc_img_fainal_02.png);
	padding-top: 25px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	margin-top: 0px;
	width: 100%;
	max-width: 999px;
}


.pink-block_col {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
	margin-top: 20px;
	margin-bottom: 15px;
}
.pink-block_col > div {
	width: 14.2%;
	padding: 10px;
}
.pink-block_col > div img {
	width: 100%;
    max-width: 150px;
}
@media screen and (max-width: 767px) {
.pink-block_col > div {
	width: 25%;
}
}
@media screen and (max-width: 450px) {
 .pink-block_col > div {
 width: 50%;
}
}