@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Montserrat);
.btn-twitter .fa.fa-lg, .btn-facebook .fa.fa-lg {
  vertical-align: -1px;
  margin-right: 2px;
}

.btn-twitter {
  color: #FFF;
  background-color: #55ACEE;
  border-color: #4ca7ed;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -moz-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}
.btn-twitter:focus, .btn-twitter.focus {
  color: #FFF;
  background-color: #2795e9;
  border-color: #1167a8;
}
.btn-twitter:hover {
  color: #FFF;
  background-color: #2795e9;
  border-color: #178ce5;
}
.btn-twitter.active, .btn-twitter.active, .open > .btn-twitter.dropdown-toggle {
  color: #FFF;
  background-color: #3ea1ec;
  border-color: #309aea;
}
.btn-twitter.active:hover, .btn-twitter.active:focus, .btn-twitter.active.focus, .btn-twitter.active:hover, .btn-twitter.active:focus, .btn-twitter.active.focus, .open > .btn-twitter.dropdown-toggle:hover, .open > .btn-twitter.dropdown-toggle:focus, .open > .btn-twitter.dropdown-toggle.focus {
  color: #FFF;
  background-color: #1583d7;
  border-color: #1167a8;
}
.btn-twitter:active, .btn-twitter.active, .open > .btn-twitter.dropdown-toggle {
  background-image: none;
}
.btn-twitter.disabled, .btn-twitter.disabled:hover, .btn-twitter.disabled:focus, .btn-twitter.disabled.focus, .btn-twitter.disabled:active, .btn-twitter.disabled.active, .btn-twitter[disabled], .btn-twitter[disabled]:hover, .btn-twitter[disabled]:focus, .btn-twitter[disabled].focus, .btn-twitter[disabled]:active, .btn-twitter[disabled].active, fieldset[disabled] .btn-twitter, fieldset[disabled] .btn-twitter:hover, fieldset[disabled] .btn-twitter:focus, fieldset[disabled] .btn-twitter.focus, fieldset[disabled] .btn-twitter:active, fieldset[disabled] .btn-twitter.active {
  background-color: #55ACEE;
  border-color: #4ca7ed;
}
.btn-twitter .badge {
  color: #55ACEE;
  background-color: #FFF;
}

.btn-facebook {
  color: #FFF;
  background-color: #3B5998;
  border-color: #385591;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -moz-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}
.btn-facebook:focus, .btn-facebook.focus {
  color: #FFF;
  background-color: #2d4373;
  border-color: #141f35;
}
.btn-facebook:hover {
  color: #FFF;
  background-color: #2d4373;
  border-color: #273b65;
}
.btn-facebook.active, .btn-facebook.active, .open > .btn-facebook.dropdown-toggle {
  color: #FFF;
  background-color: #344e86;
  border-color: #30487b;
}
.btn-facebook.active:hover, .btn-facebook.active:focus, .btn-facebook.active.focus, .btn-facebook.active:hover, .btn-facebook.active:focus, .btn-facebook.active.focus, .open > .btn-facebook.dropdown-toggle:hover, .open > .btn-facebook.dropdown-toggle:focus, .open > .btn-facebook.dropdown-toggle.focus {
  color: #FFF;
  background-color: #23345a;
  border-color: #141f35;
}
.btn-facebook:active, .btn-facebook.active, .open > .btn-facebook.dropdown-toggle {
  background-image: none;
}
.btn-facebook.disabled, .btn-facebook.disabled:hover, .btn-facebook.disabled:focus, .btn-facebook.disabled.focus, .btn-facebook.disabled:active, .btn-facebook.disabled.active, .btn-facebook[disabled], .btn-facebook[disabled]:hover, .btn-facebook[disabled]:focus, .btn-facebook[disabled].focus, .btn-facebook[disabled]:active, .btn-facebook[disabled].active, fieldset[disabled] .btn-facebook, fieldset[disabled] .btn-facebook:hover, fieldset[disabled] .btn-facebook:focus, fieldset[disabled] .btn-facebook.focus, fieldset[disabled] .btn-facebook:active, fieldset[disabled] .btn-facebook.active {
  background-color: #3B5998;
  border-color: #385591;
}
.btn-facebook .badge {
  color: #3B5998;
  background-color: #FFF;
}

.btn-hatebu {
  color: #FFF;
  background-color: #178fde;
  border-color: #1689d5;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -moz-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}
.btn-hatebu:focus, .btn-hatebu.focus {
  color: #FFF;
  background-color: #1271b0;
  border-color: #0a3f61;
}
.btn-hatebu:hover {
  color: #FFF;
  background-color: #1271b0;
  border-color: #10659d;
}
.btn-hatebu.active, .btn-hatebu.active, .open > .btn-hatebu.dropdown-toggle {
  color: #FFF;
  background-color: #1580c7;
  border-color: #1377b9;
}
.btn-hatebu.active:hover, .btn-hatebu.active:focus, .btn-hatebu.active.focus, .btn-hatebu.active:hover, .btn-hatebu.active:focus, .btn-hatebu.active.focus, .open > .btn-hatebu.dropdown-toggle:hover, .open > .btn-hatebu.dropdown-toggle:focus, .open > .btn-hatebu.dropdown-toggle.focus {
  color: #FFF;
  background-color: #0f5c8f;
  border-color: #0a3f61;
}
.btn-hatebu:active, .btn-hatebu.active, .open > .btn-hatebu.dropdown-toggle {
  background-image: none;
}
.btn-hatebu.disabled, .btn-hatebu.disabled:hover, .btn-hatebu.disabled:focus, .btn-hatebu.disabled.focus, .btn-hatebu.disabled:active, .btn-hatebu.disabled.active, .btn-hatebu[disabled], .btn-hatebu[disabled]:hover, .btn-hatebu[disabled]:focus, .btn-hatebu[disabled].focus, .btn-hatebu[disabled]:active, .btn-hatebu[disabled].active, fieldset[disabled] .btn-hatebu, fieldset[disabled] .btn-hatebu:hover, fieldset[disabled] .btn-hatebu:focus, fieldset[disabled] .btn-hatebu.focus, fieldset[disabled] .btn-hatebu:active, fieldset[disabled] .btn-hatebu.active {
  background-color: #178fde;
  border-color: #1689d5;
}
.btn-hatebu .badge {
  color: #178fde;
  background-color: #FFF;
}

.fa.fa-hatebu:before {
  content: "B!";
  font-family: Verdana;
  font-weight: bold;
}

body {
  margin-top: 80px;
}

.jumbotron.special {
  position: relative;
  overflow: hidden;
  min-height: 530px;
  margin-bottom: 0;
  text-align: center;
  /*background-color: #FDCEA0;*/
  background-color:#b0c4de;
  background-image: url(../img/2.png);
  background-repeat: no-repeat;
  background-position: -35% center;
  background-size: 70%;
}
.jumbotron.special .honoka {
  position: absolute;
  bottom: -20px;
  left: 0;
  height: 530px;
  width: 400px;
  background-image: url();
  background-repeat: no-repeat;
}
.jumbotron.special .outline {
  margin-top: 0px;
}
.jumbotron.special h1,
.jumbotron.special .h1 {
  font-family: Montserrat, sans-serif;
}
.jumbotron.special .download {
  margin: 40px auto 20px;
}
.jumbotron.special .basedon {
  color: #777777;
  text-shadow: #FFF 0 1px 2px;
}

section.section {
  padding: 150px 0;
}
section.section.section-inverse {
  /*background-color: #fff5eb;*/
    background-color: #f5fcff;
}
section.section .subtitle {
  text-align: center;
  margin-bottom: 20px;
}
section.section .subtitle h2 {
  margin-top: 0;
}

.point .point-box {
  text-align: center;
}
.point .point-box .point-circle {
  margin: 0 auto;
  width: 100px;
  height: 100px;
  font-size: 60px;
  line-height: 100px;
  color: #fff;
  border-radius: 100%;
}
.point .point-box .point-circle.start {
  background-color: #4caf50;
}
.point .point-box .point-circle.replace {
  background-color: #ff9800;
}
.point .point-box .point-circle.compass {
  background-color: #2196f3;
}
.point .point-box .point-circle.japanese {
  background-color: #f44336;
}
.point .point-box .point-circle.japanese span.icon-jp:before {
  content: "あ";
  font-weight: bold;
}
.point .point-box .point-description h4 {
  text-align: center;
}
.point .point-box .point-description p {
  text-align: justify;
}

.getting-started h3 {
  margin-top: 0;
}

.japanese-font .well > h3 {
  margin-top: 10px;
}

.featured .subtitle h2 {
  font-size: 24px;
}
.featured ul.featured-list a {
  opacity: 0.7;
}
.featured ul.featured-list a:hover, .featured ul.featured-list a:active, .featured ul.featured-list a:focus {
  opacity: 0.5;
}
.featured ul.featured-list li {
  margin: 6px 20px;
}

.thumbnail {
  background: #FFF;
}
.thumbnail > a:hover, .thumbnail > a:active, .thumbnail > a:focus {
  opacity: 0.7;
}

footer {
  padding: 40px 0px;
  color: #eeeeee;
  background-color: #333333;
}
footer .social-button {
  position: relative;
  overflow: hidden;
  margin: 0px auto !important;
  padding: 10px 0;
}
footer .social-button > ul {
  position: relative;
  left: 50%;
  float: left;
  margin: 0px;
  padding: 0px;
  list-style: outside none none;
}
footer .social-button > ul > li {
  position: relative;
  left: -50%;
  float: left;
  margin: 0px 10px;
  padding: 0px;
}
footer .social-button > ul > li .fb-like > span {
  vertical-align: 0 !important;
}
footer .copyright {
  padding-top: 10px;
  padding-bottom: 10px;
}

footer .copyright a{
color:#fff;
font-size:18px;
}

.bootstrap-default {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
}
.bootstrap-default > h3 {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 24px;
}


.explain_contents{

  margin-bottom:150px;

  position: relative;
  overflow: hidden;
  min-height: 530px;

  background-image: url(../img/3.png);
  background-repeat: no-repeat;
  background-position: -35% center;
  background-size: 70%;

}

.margin-10-0 {

    margin:20px auto ;

}

.form-error-margin {
    margin-top:30px ;
}

.form-margin {
    margin-top:30px;
}

