#outer_frame{
    background-color:#fff;
    position:relative;
    font-family: Quicksand, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    color:#555555;

 		font-size:100%;
  vertical-align:baseline;

  max-width:768px;
  margin:0 auto;
	padding:0;
	border:0;
  outline:0;
	overflow: hidden;
  word-wrap: break-word;
}

#outer_frame a {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;

  text-decoration: none;

}

/*** ユーティリティ ***/

.center { text-align:center; }
.right  { text-align:right; }
.left   { text-align:left; }

.bold { font-weight:bold; }

.fclear { clear:both; }
.fleft  { float: left; }
.fright { float: right; }

.pad3  { padding:3px; }
.pad5  { padding:5px; }
.pad8  { padding:8px; }
.pad10 { padding:10px; }

.pad3_w  { padding:0px 3px; }
.pad5_w  { padding:0px 5px; }
.pad8_w  { padding:0px 8px; }
.pad10_w { padding:0px 10px; }

.pad3_h  { padding:3px 0px; }
.pad5_h  { padding:5px 0px; }
.pad8_h  { padding:8px 0px; }
.pad10_h { padding:10px 0px; }
.pad15_h { padding:15px 0px; }

.margin3  { margin:3px; }
.margin5  { margin:5px; }
.margin10 { margin:10px; }

.red    { color: #e13333; }
.green  { color: #1c9652; }
.orange { color: #e14833; }
.blue   { color: #4356b9; }
.pink   { color: #de7791; }
.purple { color: #b646df; }
.aqua   { color: #41c1e8; }
.yellow { color: #fda005; }
.hide{
    display:none;
}
.radius2{
  border-radius:2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
}
.radius5{
  border-radius:5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}



.clear{
    clear:both;
}
/* ----------------------------------------------------------*/
#outer_frame#footer{
    width:100%;
    text-align:center;
    margin:10px 0px;
}
#outer_frame #footer img{
    width:100%;
}
#outer_frame #page-top{
  position: fixed;

  border:solid 2px #888;
  border-radius:3px;
  margin:0 10px 10px 0px;
  padding:10px;
  color:#fff;
  text-align:center;
  font-size:xx-small;
  background-color:#888;
  opacity:0.75;
  right:0px;

}
@media screen and (min-width : 768px) {
    #footer{
        float:left;
    }
    #footer img{
        width:32.5%;
        border: solid 1px #999;

    }
    #footer img.img_l{
        border-top: solid 1px #999;
        border-bottom: solid 1px #999;
        border-right: solid 1px #999;

        border-left: solid 2px #999;

    }
    #footer img.img_r{

        border-top: solid 1px #999;
        border-bottom: solid 1px #999;
        border-left: solid 1px #999;

        border-right: solid 2px #999;

    }


}
/*-----------------------------------------------------------*/
.title_ban{
    width:100%;
    text-align:center;
}
.title_ban img{
    width:80%;
}
/* ----------------------------------------------------------*/
#menu{
    text-align:center;
    width:100%;

}
#menu div{
    display:inline;
    position:relative;

}

#menu div img{
    /*    width:31%;
    */
    width:18%;
    padding:3px 0px;
    vertical-align:top;
    cursor:pointer;

}
.new_mark{
    border-radius:50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-color:red;
    color:#fff;
    padding:3px 1px 1px 1px;
    font-size:40%;
    font-weight:bold;
    position:absolute;
    z-index:800;
    top:18%;
    left:85%;
    vertical-align:bottom;

}
#kisekae-modal{
    letter-spacing:0.1em;
    line-height:1.5;
    text-align:center;
    width:100%
    padding:15px;
}
#kisekae-modal img{
    width:100%;
    margin :10px auto;
}



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

    #menu{
        text-align:center;
        display:table-cell;
        vertical-align: middle;
        padding:10px 0px 0px 0px;
        /*        border-top:solid 1px #000; */
    }
    #menu div img{
        padding:3px 1px;
        //        width:15.5%;
        width:19%;
    }
    .new_mark{
        top:0%;
        left:90%;
        font-size:100%;
    }
  #kisekae-modal{

  }
  #kisekae-modal img{
    width:90%;
  }

}
#outer_frame .close
{
    background-color:#555;
    color:#fff;
    font-weight:bold;
    padding:10px 20px;
    border-radius:10px;
    cursor:pointer
}
#outer_frame .hr01{

    height: 1px;
    background: #bbb;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -moz-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -ms-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -o-linear-gradient(left, #ccc, #333, #ccc);
    width:85%;
    margin:15px auto;
}

/* ----------------------------------------------------------*/
#copyright{
    clear:both;
    padding:10px;
}


/* ----------------------------------------------------------*/
#btm_kisekae_menu{
  width:90%;
  margin:15px auto;
}
#btm_kisekae_menu img{
  width:100%;
  margin-bottom:15px;

}

#stampcard-modal #card_img{
  width:100%;
  position:relative;
}
#stampcard-modal  #card_img img{
  width:100%;
}
#stampcard-modal p{
  font-weight: bold;
  text-align:center;
  line-height:125%;
}
#stampcard-modal p span{
  color:red;
}
#stampcard-modal #card_img img.cmp_img{
  width:18%;
  position:absolute;
  display:none;
}

#stampcard-modal #card_img img.img_1{
  top:28%;
  left:1.5%;
}
#stampcard-modal #card_img img.img_2{
  top:28%;
  left:21.5%;
}

#stampcard-modal #card_img img.img_3{
  top:28%;
  left:41%;
}
#stampcard-modal #card_img img.img_4{
  top:28%;
  left:61%;
}
#stampcard-modal #card_img img.img_5{
  top:28%;
  left:81%;
}

#stampcard-modal #card_img img.img_6{
  top:63%;
  left:1.5%;
}
#stampcard-modal #card_img img.img_7{
  top:63%;
  left:21.5%;
}

#stampcard-modal #card_img img.img_8{
  top:63%;
  left:41%;
}
#stampcard-modal #card_img img.img_9{
  top:63%;
  left:61%;
}
#stampcard-modal #card_img img.img_10{
  top:63%;
  left:81%;
}