html {
    overflow-x: hidden;
}
body {
    text-align: center;
    color: #4e4e4e;
    font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic'
}
ul{
  margin:0;
  padding:0;
}

ul li{
  display: inline-block;
}

a{
    color: #e7316e;
}
a:hover{
    text-decoration: none;
}
a img:hover{
    opacity: 0.6;
}
h1 {
    font-size: 37px;
    margin-bottom: 0;
}
h2 {
    background-color: #385780;
    padding: 10px 0;
    color: #ffffff;
    letter-spacing: 2px;
    font-size: 26px;
}

h3 {
    background-color: #385780;
    padding: 10px 0;
    color: #ffffff;
    letter-spacing: 2px;
    font-size: 26px;
    margin: 0;
}
p{
    line-height: 1.3em;
    letter-spacing: 1px;
    font-weight: bold;
    font-size: 1.5em;
    margin: 0;
}

p.big{
  font-size: 1.8em;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.sp{
    display: none;
}

.line_btn img{
  width:auto;
  height:28px;
}

.ul1{
  text-align: right;
  margin-right:10%;
}
.twitter {
    padding: 0px;

}

/*content*/
div#content_bg {
    overflow: hidden;
}
div#content_bg {
    background: -moz-linear-gradient(bottom, #fffbc8,#f7acac);
    background: -webkit-linear-gradient(bottom, #fffbc8,#f7acac);
    background: linear-gradient(to bottom, #fffbc8,#f7acac);
    background-attachment: fixed;
}
.head {
    background-color: #f3f1e0;
    text-align: left;
}
.headerimg {
    border-bottom: solid #385780 9px;
}
.twitter a img,.headerimg a img {
    border: none;
    width: 15%;
    margin-left: 52px;
    margin-top: 5px;
}
div#content {
    padding: 2%;
    background-color: #ffffff;
    max-width: 1100px;
    width: 96%;
    margin: 0 auto;
}
div#content img {
    max-width: 100%;
}
.cont_l{
    float: left;
    width: 49.5%;
}
.cont_r{
    float: right;
    width: 49.5%;

}

#bannerarea{
  margin: 3% 0;
}

/*map*/
#map{
    max-width: 1100px;
    padding: ;
    margin: 3% 0;
}

/*fotter*/
.footer {
    background-color: #385780;
}
.footer img {
    width: 23%;
    border: solid 0;
}


@media screen and  (max-width: 900px){
.sp{
    display: inline;
}
.pc{
    display: none;
}
.head {
    height: 50%;
    text-align: center;
}
.twitter a img  {
    width: 35%;
    margin-left: 0px;
    text-align: center;
}
.ul1{
    text-align: center;
    margin:0;
     }
.headerimg a img  {
    width: 60%;
    max-width: 225px;
    margin-left: 0px;
}
.footer img {
    width: 52%;
}
.cont_l{
    float: none;
    width: 100%;
}
.cont_r{
    float: none;
    width: 100%;
    max-width: 650px;
    padding: 0;
    margin: 0 auto;
}
#map{
    margin: 10% 0;
}
}


@media screen and  (max-width: 650px){
    h1{
        font-size: 7vw;
    }
    h2,h3{
        font-size: 5vw;
        line-height: 5vw;
    }

    p{
      font-size: 4vw;
      line-height: 5vw;
    }
}