@charset "UTF-8";
/* ===============================================================================
 * まいにちスヌーピー
 * =============================================================================== */
#cboxLoadedContent {
  border:none;
  -webkit-border-radius: 15px;
          border-radius: 15px;
  padding: 35px 25px 15px;
}
#cboxContent {
  background: transparent;
}
.cboxPhoto {
  width: 100%;
  height: auto;
  max-width: none;
}
#cboxClose {
  width: 30px;
  height: 30px;
  background: url(../images/btn_close.png) no-repeat center center;
  -webkit-background-size: 30px auto;
       -o-background-size: 30px auto;
          background-size: 30px auto;
}

.peanuts-visual {
  background-image: url(./images/main_bg_01.png),url(./images/main_bg_02.png);
  background-repeat: repeat-x,repeat-x;
  background-position: top center,bottom center;
  width: 100%;
  min-width: 1280px;
  height: 434px;
}
.peanuts-visual h1 {padding-left: 18px; margin-bottom: -42px;}
#peanuts {
  font-family: "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", 游ゴシック, "Yu Gothic", 游ゴシック体, YuGothic, メイリオ, Meiryo, sans-serif;
  width: 1024px;
  margin: 0 auto;
  padding-top: 50px;
  padding-bottom: 100px;
}
.content-01{
  float: left;
  width: 500px;
}
.content-02 {
  float: right;
  width: 524px;
}
.content-01 h2,
.content-02 h2 {
  text-align: center;
}
.content-01 h2 img,
.content-02 h2 img {
  max-width: 100%;
  width: auto;
}

.content-01 {
  padding: 0 26px 0 0;
}
.content-01 div.ib {
  width: 48%;
  padding:0 5px;
}
.content-01 .day-select {
  margin-top: 15px;
}
.content-01 input {
  -webkit-border-radius: 5px;
          border-radius: 5px;
      width: 60%;
  border:3px solid #000;
  padding: 5px 5px 3px;
  font-size: 22px;
  font-size: 2.2rem;
  vertical-align: bottom;
  text-align: center;
  font-weight: bold;
  line-height: 1;
}
.content-01 label {
  padding-left: 8px;
  vertical-align: bottom;
  font-weight: bold;
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: -5px;
}
.content-01 .caution {
  margin-top: 15px;
  font-size: 16px;
  font-size: 1.6rem;
}

.content-02 .box {
  display: table;
  width: 498px;
  table-layout: fixed;
  word-spacing: -1em;
  padding-top: 10px;
}
.content-02 h2 + .box {
  padding-top: 20px;
}
.content-02 .box .ico,
.content-02 .box .slt,
.content-02 .box .btn {
  display: table-cell;
  word-spacing: normal;
  vertical-align: middle;
}

.content-02 .box .ico {
  width: 90px;
  padding-left: 6px;
}
.content-02 .box .slt {
  width: 288px;
  padding: 0 18px 0 12px;
}

.content-02 .box .btn {
  width: 122px;
}
.content-02 .box .btn a {
  display: block;
  padding: 0;
}
.bnr-area {
  width: 1056px;
  margin-left: -32px;
  overflow: hidden;
  padding-top: 100px;
}

.bnr-area li {
  float: left;
  margin-left: 32px;
}

#footer-peanuts {
  background: transparent url(../images/bg_btm.png) repeat-x center top;
  padding-top: 104px;
  padding-bottom: 10px;
}
#footer-peanuts .copy-peanuts {
  text-align: right;
  width: 1024px;
  margin: 0 auto;
}
#footer-peanuts .copy-peanuts small {
  width: 204px;
  display: inline-block;
}
#footer-peanuts .copyright {
  width: 100%;
  margin: 0 auto;
  float: none;
  border-top: #f00 2px solid;
  color:#000;
  font-size: 10px;
  font-size: 1.0rem;
  text-align: right;
  padding-top: 8px;
}
#footer-peanuts .copyright  small {
  width: 1024px;
  margin: 0 auto;
  display: block;
}

/* 9/27追加 */

/* クーポン */
.coupon {
  margin-top: 35px;
  padding: 20px 15px;
  border: 5px solid #2b9eff;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.coupon-txt01 {
  color: #2b9eff;
  font-size: 20px;
  font-size: 2.0rem;
  font-weight: bold;
}
.coupon-txt02 {
  font-size: 40px;
  font-size: 4.0rem;
}


/* ピーナッツコミック */
#peanuts {
  width: 1180px;
}
.limit {
  background: url(images/bg_blu.png) repeat 0 0;
  width: 100%;
  margin-top: 120px;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  padding: 10px;
}
.limit-inner {
  background: url(images/bg_wht.png) repeat 0 0;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  padding: 10px;
}

.limit .ttl {
  text-align: center;
  margin-top: -90px;
}
.limit .subttl {
  text-align: center;
  margin-top: 50px;
}
.limit-sub-txt {
  text-align: center;
  font-size: 16px;
  font-size: 1.6rem;
  margin-top: 30px;
  line-height: 2;
}
.limit-list {
  display: table;
  word-spacing: -1em;
  margin: 45px 5% 0;
  width: 90%;
  text-align: center;
}
.limit-list + .subttl {
  margin-top: 80px;
}
.limit-item {
  display: inline-block;
  word-spacing: normal;
  width: 33.333333%;
}

.limit-item p + p {
  margin-top: 10px;
}
.limit-sub-txt02 {
  font-size: 18px;
  font-size: 1.8rem;
  margin-top: 30px;
  margin-left: 30px;
}
/* 201704 */
.anchor {display: none;}
.select-area {
  margin-top: 20px;
}
.select-box .select-input {float: left;}
.select-box .select-caution {float: right;}
.select-box {margin-top: 20px;}
.select-input .ib{
  vertical-align: bottom;
}
.select-input input {
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 164px;
    border: 3px solid #000;
    padding: 12px 5px 10px;
    font-size: 22px;
    font-size: 2.2rem;
    vertical-align: bottom;
    text-align: center;
    font-weight: bold;
    line-height: 1;
}
.select-input label {margin-left: 15px;}
.select-input div ~ div {margin-left: 35px;}
.select-box .select-caution {
  font-size: 18px;
}
.select-box .select-caution li ~ li {margin-top: .3em;}
.select-box ~ .select-box {margin-top: 46px;}
.select-box .check-box {
  display: table;
  width: 856px;
  word-spacing: -1em;
  text-align: center;
  float: left;
}
.select-box .check-box label{
  display: inline-block;
  vertical-align: middle;
  word-spacing: normal;

}


.select-box .check-box input[type="checkbox"] {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}
.select-box .check-box label span {
  position: relative;
  display: inline-block;
  padding-left: 60px;
}
.select-box .check-box label span:before{
  content:"";
  background: url(./images/check_def.png) no-repeat 0 0;
  width: 49px;
  height: 44px;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}
.select-box .check-box input[type="checkbox"]:checked + span:before {
  background: url(./images/check_on.png) no-repeat 0 0;
}
.select-box .check-box label ~ label {
  margin-left: 50px;
}
.select-box .btn-search {float: right; margin-top: -15px;}
.select-box .btn-search:hover {opacity: .7;}

.sample-area {
  margin-top: 94px;
  position: relative;
  border: #ffd500 3px solid;
  -webkit-border-radius: 10px;
          border-radius: 10px;
  position: relative;
  padding: 80px 44px;
}
.sample-area:after {
  content: "";
  background: url(./images/ico_snoopy.png) no-repeat 0 0;
  width: 147px;
  height: 109px;
  display: block;
  position: absolute;
  right: 23px;
  top: -68px;

}
.sample-area .ttl {
  position: absolute;
  width: 100%;
  left: 0;
  top: -22px;
  text-align: center;
}
.sample-area .notice {
  font-weight: bold;
  font-size: 20px;
}
.sample-area .notice span {color: #f00;font-weight: bold;}
.sample-box {
  border-bottom:#ffd500 2px dashed;
}
.sample-box ~ .sample-box {margin-top: 45px;}
.sample-box .cover {
  width: 100%;
  display: table;
  word-spacing: -1em;
  padding: 0 50px 0 19px;
}
.sample-box .cover .title-box,
.sample-box .cover .photo {
  display: table-cell;
  vertical-align: middle;
  word-spacing: normal;
}
.sample-box .cover .title-box {
  width: 268px;
  min-height: 0;
  padding: 0;
}
.sample-box .cover .title-box i {
  display: inline-block;
  margin-right: 25px;
  vertical-align: middle;
}
.sample-box .cover .title-box img {display: inline-block; vertical-align: middle;}
.sample-box .cover .photo {
  width: 376px;
  text-align: center;
}
.peanuts-visual_2nd {
  background: url(./images/main_2nd_bg.png) repeat 0 0;
  width: 100%;
  min-width: 1280px;
  height: 124px;
  border-bottom: #ECECEC 4px solid;
}
.peanuts-visual_2nd .ttl {padding-left: 18px; margin-bottom: -42px;}
.result-area .title {
  text-align: center;
  font-size: 38px;
  font-weight: bold;
}
.result-cover {
  width: 1194px;
  display: table;
  word-spacing: -1em;
  margin-left: -5px;
  padding-top: 10px;
}
.result-box {
  display: inline-block;
  vertical-align: top;
  word-spacing: normal;
  width: 286px;
  margin-left: 12px;
  border-style: solid;
  border-width: 3px;
  padding-bottom: 20px;
  margin-top: 30px;
}
.result-box .photo {
display:table-cell;
width:100%;
vertical-align:middle;
}
.result-box .photo img {
 width:100%;
 height:auto;
/*position:absolute;
top:50%;
left:0;
-webkit-transform: translateY(50%);
   -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
     -o-transform: translateY(50%);
        transform: translateY(50%);*/
}
.result-box .title-box {
  display: table;
  word-spacing: -1em;
  width: 100%;
  padding: 0;
  min-height: 0;
  height: 62px;
}
.result-box .title-box .year,
.result-box .title-box .title {
  display: table-cell;
  vertical-align: middle;
  word-spacing: normal;
}
.result-box .title-box .year {
  font-weight: bold;
  font-size: 22px;
  line-height: 1;
  text-align: center;
  width: 62px;
  color: #FFF;
}
.result-box .title-box .title {
  line-height: 1.2;
  font-size: 26px;
  padding-left: 20px;
  font-weight: normal;
  text-align: left;
}
.result-box .photo {
  text-align: center;
}
.result-box .button-box {
  zoom:1;
  padding: 0 24px;
  margin-top: 5px;
}
.result-box .button-box:after {
  content: "";
  display: block;
  clear: both;
}
.result-box .btn-pop {
  float: left;
  width: 60px;
}
.result-box .btn-cart {
  float: right;
  width: 60px;
}
.result-box.GRN {
  border-color: #22ad38;
}
.result-box.GRN .title-box .year {
  background: #22ad38;
}
.result-box.BLU {
  border-color: #00a1df;
}
.result-box.BLU .title-box .year {
  background: #00a1df;
}
.result-box.PNK {
  border-color: #eb79ac;
}
.result-box.PNK .title-box .year {
  background: #eb79ac;
}

#cboxLoadedContent {
  padding: 0;
  -webkit-border-radius: 8px;
          border-radius: 8px;
}
#cboxClose {
  width: 105px;
  height: 36px;
  background: url(./images/btn_close.png) no-repeat 0 0;
    top: 13px;
    right: 14px;
}
.modal-cover .result-box {
  display: block;
  width: 100%;
  max-width: 760px;
  margin-left: 0;
  border: none;
  padding-bottom: 30px;
  margin-top: 0;
}
.modal-cover .result-box .title-box {
  display: table;
  word-spacing: -1em;
  width: 100%;
  padding: 0 150px 0 26px;
  min-height: 0;
  height: 62px;
  text-align: left;
}

.modal-cover .result-box.GRN .title-box {
  background: #22ad38;
}
.modal-cover .result-box.BLU .title-box  {
  background: #00a1df;
}
.modal-cover .result-box.PNK .title-box  {
  background: #eb79ac;
}
.modal-cover .result-box .title-box .year,
.modal-cover .result-box .title-box .title {
  vertical-align: middle;
}
.modal-cover .result-box .title-box .year {
  font-size: 26px;
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
}
.modal-cover .result-box .title-box .title {
  font-size: 26px;
  padding-left: 20px;
  font-weight: bold;
  color: #FFF;
  width: 100%;
}
.modal-cover .result-box .photo {
  text-align: center;
  margin: 15px 0;
display:block;
}
.modal-cover .result-box .photo img {
 width:450px;
}
.modal-cover .result-box .button-box {
  text-align: center;
}
.modal-cover .result-box .btn-cart {
  float: none;
  width: 400px;
  margin:  0 auto;

}
.modal-cover .result-box .btn-cart a {
  display: block;
  background: #f00;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  padding: 12px;
  font-size: 30px;
  line-height: 1.2;
}
.modal-cover .result-box .btn-cart a:hover {
  opacity: .7;
}

#loading {
  z-index: 10000;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.5);
  width: 100%;
  height: 100%;
  text-align: center;
}

#loading .inner{
  background: #fff;
  width:  200px;
  height: 200px;
  padding:50px 0 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
}

#loading .progress{
  margin: 0 0 30px;
}

#loading .progress img{
  width: 100px;
}

#loading img.title {
  width: 100%;
}

.btn-nav_area {
  width:1180px;
 margin:0 auto -50px;
 padding:50px 0 10px 12px;
}
.btn-nav_area .btn-back {
 float:left;
}
.btn-nav_area .btn-back ~ .btn-back {
 float:right;
}