@charset "UTF-8";
body {
  margin: 0;
  padding: 0;
  background-color: #fff;
  color: #555;
  text-align: center;
  font: normal 14px Sans-serif;
  line-height: 150%;
  font-family: "小塚ゴシック Pr6N", "Kozuka Gothic Pr6N", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", 'Helvetica', sans-serif;
}

th, td {
  color: #555;
  vertical-align: top;
  font-weight: normal;
  font: normal 14px Sans-serif;
  line-height: 150%;
}

img {
  border: none;
}

form {
  margin: 0;
}

a {
  cursor: pointer;
}

a:link {
  color: #486B97;
  text-decoration: none;
}

a:visited, a:active {
  color: #5B8190;
  text-decoration: none;
}

a:hover {
  color: #946349;
  text-decoration: underline;
}

@media only screen and (max-width: 767px) {
  .wrap {
    width: 320px;
    margin: auto;
  }
  .wrap h1 {
    margin: 0 0 10px 0;
    border-bottom: 2px dotted #999;
    padding: 20px 10px 6px 10px;
    font-size: 16px;
    line-height: 150%;
    text-align: left;
  }
  .wrap h2 {
    margin: 0 0 10px 0;
    background-color: #333;
    color: #fff;
    padding: 8px 10px 6px 10px;
    font-size: 14px;
    line-height: 150%;
  }
}

@media only screen and (min-width: 768px) {
  .wrap {
    width: 1080px;
    margin: auto;
  }
  .wrap h1 {
    margin: 0 0 10px 0;
    border-bottom: 2px dotted #999;
    padding: 20px 10px 6px 10px;
    font-size: 16px;
    line-height: 150%;
    text-align: left;
  }
  .wrap h2 {
    margin: 0 0 10px 0;
    background-color: #333;
    color: #fff;
    padding: 8px 10px 6px 10px;
    font-size: 14px;
    line-height: 150%;
  }
}

.row12grid .center {
  text-align: center;
}

.row12grid .inner {
  margin: 0 0 20px 10px;
}

.row12grid .margin-bottom {
  margin: 0 0 30px 0;
}

.row12grid p {
  margin: 15px 0 0 0;
}

.row12grid p:first-child {
  margin: 0 0 0 0;
}

@media only screen and (max-width: 767px) {
  .row12grid .grid1,
  .row12grid .grid2,
  .row12grid .grid3,
  .row12grid .grid4,
  .row12grid .grid5,
  .row12grid .grid6,
  .row12grid .grid7,
  .row12grid .grid8,
  .row12grid .grid9,
  .row12grid .grid10,
  .row12grid .grid11,
  .row12grid .grid12 {
    display: block;
    margin: 0 0 20px 0;
  }
  .row12grid .grid1 img,
  .row12grid .grid2 img,
  .row12grid .grid3 img,
  .row12grid .grid4 img,
  .row12grid .grid5 img,
  .row12grid .grid6 img,
  .row12grid .grid7 img,
  .row12grid .grid8 img,
  .row12grid .grid9 img,
  .row12grid .grid10 img,
  .row12grid .grid11 img,
  .row12grid .grid12 img {
    max-width: 300px;
  }
}

@media only screen and (min-width: 768px) {
  .row12grid {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  .row12grid .grid1 {
    width: 8.333%;
  }
  .row12grid .grid1 img {
    max-width: 80px;
  }
  .row12grid .grid2 {
    width: 16.666%;
  }
  .row12grid .grid2 img {
    max-width: 160px;
  }
  .row12grid .grid3 {
    width: 24.999%;
  }
  .row12grid .grid3 img {
    max-width: 240px;
  }
  .row12grid .grid4 {
    width: 33.332%;
  }
  .row12grid .grid4 img {
    max-width: 320px;
  }
  .row12grid .grid5 {
    width: 41.665%;
  }
  .row12grid .grid5 img {
    max-width: 400px;
  }
  .row12grid .grid6 {
    width: 49.998%;
  }
  .row12grid .grid6 img {
    max-width: 480px;
  }
  .row12grid .grid7 {
    width: 58.331%;
  }
  .row12grid .grid7 img {
    max-width: 560px;
  }
  .row12grid .grid8 {
    width: 66.664%;
  }
  .row12grid .grid8 img {
    max-width: 640px;
  }
  .row12grid .grid9 {
    width: 74.997%;
  }
  .row12grid .grid9 img {
    max-width: 720px;
  }
  .row12grid .grid10 {
    width: 83.33%;
  }
  .row12grid .grid10 img {
    max-width: 800px;
  }
  .row12grid .grid11 {
    width: 91.663%;
  }
  .row12grid .grid11 img {
    max-width: 880px;
  }
  .row12grid .grid12 {
    width: 99.996%;
  }
  .row12grid .grid12 img {
    max-width: 960px;
  }
}

.row12space .center {
  text-align: center;
}

.row12space .inner {
  margin: 0 0 20px 10px;
}

.row12space .margin-bottom {
  margin: 0 0 30px 0;
}

.row12space p {
  margin: 15px 0 0 0;
}

.row12space p:first-child {
  margin: 0 0 0 0;
}

@media only screen and (max-width: 767px) {
  .row12space .grid1,
  .row12space .grid2,
  .row12space .grid3,
  .row12space .grid4,
  .row12space .grid5,
  .row12space .grid6,
  .row12space .grid7,
  .row12space .grid8,
  .row12space .grid9,
  .row12space .grid10,
  .row12space .grid11,
  .row12space .grid12 {
    display: block;
    margin: 0 0 20px 0;
  }
  .row12space .grid1 img,
  .row12space .grid2 img,
  .row12space .grid3 img,
  .row12space .grid4 img,
  .row12space .grid5 img,
  .row12space .grid6 img,
  .row12space .grid7 img,
  .row12space .grid8 img,
  .row12space .grid9 img,
  .row12space .grid10 img,
  .row12space .grid11 img,
  .row12space .grid12 img {
    max-width: 300px;
  }
}

@media only screen and (min-width: 768px) {
  .row12space {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  .row12space img {
    width: 100%;
  }
  .row12space .grid1 {
    width: 8%;
  }
  .row12space .grid1 img {
    max-width: 80px;
  }
  .row12space .grid2 {
    width: 16%;
  }
  .row12space .grid2 img {
    max-width: 160px;
  }
  .row12space .grid3 {
    width: 24%;
  }
  .row12space .grid3 img {
    max-width: 240px;
  }
  .row12space .grid4 {
    width: 32%;
  }
  .row12space .grid4 img {
    max-width: 320px;
  }
  .row12space .grid5 {
    width: 40%;
  }
  .row12space .grid5 img {
    max-width: 400px;
  }
  .row12space .grid6 {
    width: 48%;
  }
  .row12space .grid6 img {
    max-width: 480px;
  }
  .row12space .grid7 {
    width: 56%;
  }
  .row12space .grid7 img {
    max-width: 560px;
  }
  .row12space .grid8 {
    width: 64%;
  }
  .row12space .grid8 img {
    max-width: 640px;
  }
  .row12space .grid9 {
    width: 72%;
  }
  .row12space .grid9 img {
    max-width: 720px;
  }
  .row12space .grid10 {
    width: 80%;
  }
  .row12space .grid10 img {
    max-width: 800px;
  }
  .row12space .grid11 {
    width: 88%;
  }
  .row12space .grid11 img {
    max-width: 880px;
  }
  .row12space .grid12 {
    width: 96%;
  }
  .row12space .grid12 img {
    max-width: 960px;
  }
}

@media only screen and (max-width: 767px) {
  .nomobile {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .nopc {
    display: none;
  }
}

.head {
  position: relative;
}

@media only screen and (max-width: 767px) {
  .head .stars img {
    width: 100%;
  }
}

.head .lights {
  background-color: #67B791;
  margin: 5px 0;
}

.head .lights img {
  margin: 5px 35px;
}

@media only screen and (max-width: 767px) {
  .head .lights img {
    width: 20px;
    margin: 5px 3px;
  }
}

@media only screen and (max-width: 767px) {
  .head .pictures img {
    width: 100%;
  }
}

.head .language {
  position: absolute;
  top: 0;
  right: 5px;
}

@media only screen and (max-width: 767px) {
  .head .language {
    top: 85px;
  }
}

.head .language a {
  color: #FFF;
}

.opening {
  background-color: #EA566F;
  color: #FFF;
  margin: 5px 0;
  padding: 5px 0;
}

@media only screen and (max-width: 767px) {
  .opening {
    padding: 10px 15px;
  }
}

.opening p {
  margin: 10px 0 0 0;
  text-align: left;
  font-weight: bold;
}

.opening p:nth-child(1) {
  font-size: 64px;
  width: 580px;
  float: left;
  line-height: 1;
  padding-left: 15px;
}

@media only screen and (max-width: 767px) {
  .opening p:nth-child(1) {
    width: 100%;
    padding-left: 0;
    font-size: 30px;
    text-align: center;
  }
}

.opening p:nth-child(2) {
  font-size: 17px;
  width: 485px;
  float: right;
  line-height: 1.5;
  letter-spacing: 1px;
}

@media only screen and (max-width: 767px) {
  .opening p:nth-child(2) {
    width: 100%;
    font-size: 15px;
  }
}

.opening #localmap {
  height: 323px;
  width: 498px;
}

@media only screen and (max-width: 767px) {
  .opening #localmap {
    width: 100%;
  }
}

.opening #localmap .failsafe {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .opening #localmap .failsafe {
    width: 100%;
  }
}

.opening .storemaps {
  margin: 10px 15px;
  display: inline-block;
  vertical-align: top;
}

@media only screen and (max-width: 767px) {
  .opening .storemaps {
    margin: 0;
    width: 100%;
    margin-bottom: 10px;
  }
  .opening .storemaps img {
    width: 100%;
  }
}

/*img{
	margin: 10px 15px;
	@include mq-sp{
		margin:0;
		width:100%;
		margin-bottom: 10px;
	};
}*/
.main h1 {
  font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;
  font-size: 35px;
  background-color: #67B791;
  color: #FFF;
  border: none;
  padding: 0;
  padding-left: 10px;
  margin: 0;
  font-weight: normal;
  letter-spacing: 3px;
}

.main .twitter {
  width: 310px;
  float: right;
}

@media only screen and (max-width: 767px) {
  .main .twitter {
    width: 100%;
    float: none;
  }
}

@media only screen and (max-width: 767px) {
  .main .twitter .pctimeline {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .main .twitter .mobiletimeline {
    display: none;
  }
}

.main .whatsnew {
  width: 760px;
}

@media only screen and (max-width: 767px) {
  .main .whatsnew {
    width: 100%;
  }
}

.main .whatsnew p {
  text-align: left;
  font-size: 23px;
  font-weight: bold;
  padding-left: 10px;
}

@media only screen and (max-width: 767px) {
  .main .whatsnew p {
    font-size: 18px;
  }
}

.main .whatsnew div {
  width: 215px;
  display: inline-block;
  vertical-align: top;
  margin: 0 15px;
}

@media only screen and (max-width: 767px) {
  .main .whatsnew div {
    margin-bottom: 15px;
  }
}

.main .topics {
  width: 760px;
}

@media only screen and (max-width: 767px) {
  .main .topics {
    width: 100%;
  }
}

.main .topics ul {
  margin: 0;
  padding: 0;
}

.main .topics ul li {
  text-align: left;
  list-style: none;
  font-size: 18px;
  font-weight: bold;
  line-height: 2;
  letter-spacing: 3px;
  padding-left: 10px;
}

@media only screen and (max-width: 767px) {
  .main .topics ul li {
    font-size: 14px;
  }
}

.main .topics ul li a {
  color: #FFF;
}

.main .topics ul li:nth-child(2n-1) {
  background-color: #A9D8C1;
}

.main .topics ul li:nth-child(2n) {
  background-color: #67B791;
}