body {
 font-family: 'Helvetica Neue', Helvetica, Arial, Verdana, 'Òé®ÎÒ´ ProN W3', 'Hiragino Kaku Gothic ProN', 'á¤êª', Meiryo, '-3 0´·Ã¯', 'MS PGothic', sans-serif;
 font-size: 15px;
 line-height: 1.6;
 margin: 0;
 padding: 0;
 color: #333;
 *font-size: medium;
 *font: small;
 _font-size: 1;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol {
 font-size: 100%;
 font-weight: normal;
 font-style: normal;
 margin: 0;
 padding: 0;
 list-style-type: none;
}

a {
 color: #3333cc
}

p.error {
 font-weight: bold;
/* display: none; */
margin: 0 0 6px 0;
color: #f00;
font-size: 14px;
}

em {
font-weight: 700;
font-style: normal;
color: #f00;
}

.sp {
display: none;
}

div,
th,
td {
box-sizing: border-box;
}

.disc li {
list-style-type: disc;
margin: 0 0 0 1.5em;
}

img {
max-width: 100%;
}

/* ----------interaction---------- */

.accordion,
.accordion-open {
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.hidden,
.accordion-contents {
 display: none;
}

/* ----------button---------- */

a.btn {
 background-color: #5e343d;
 border-radius: 4px;
 color: #fff;
 display: inline-block;
 font-size: 140%;
 font-weight: 700;
 height: 60px;
 line-height: 60px;
 margin: 0 16px;
 position: relative;
 text-align: center;
 text-decoration: none;
 transition: none;
 width: 300px;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 -webkit-transition: all .3s;
 box-sizing: border-box;
 transition: all .3s;
}

a.btn:hover {
 background-color: #7a4c56;
}

a.btn.negative {
 background-color: #CCC;
}

a.btn.negative:hover {
 background-color: #999;
}

div.btn {
 padding: 64px 0;
 text-align: center;
}

/* ----------base---------- */

.body {
 background: #dfe0e3;
 padding: 0 0 64px 0;
 background-size: cover;
}

.inner {
 width: 960px;
 margin: 0 auto;
}

p.lead {
 padding: 20px;
}

/* ----------form---------- */

#form {
 background: #fff;
 border: 5px solid #5e343d;
 margin: 36px 0 0;
}

#form .required-notice {
 padding: 8px 0;
 text-align: center;
}

#form .required {
 color: red;
}

#form h2 {
 background: #5e343d;
 color: #FFF;
 font-size: 120%;
 font-weight: 700;
 margin: 0;
 padding: 6px 6px 12px;
 text-align: center;
}

#form h3 {
 font-weight: 700;
 margin: 16px 0 8px 0;
}

#form .directions {
 margin: 0 0 16px 0;
}

#form .pp {
 border: 1px solid #CCC;
 margin: 0 20px 20px;
 padding: 10px;
}

#form .pp h3 {
 font-weight: 700;
}

#form .pp p {
 margin: 12px 8px 8px;
}

#form .pp-apply {
 background: #fffcda;
 font-weight: 700;
 text-align: center;
}

/* ----------input---------- */

#form input.address {
 width: 440px;
}

#form input.mail {
 margin: 6px 0;
 width: 460px;
}

#form input.name {
 width: 160px;
}

#form input.postalcode1 {
 width: 60px;
}

#form input.postalcode2,
#form input.tel {
 width: 80px;
}

#form .quiz input.text {
 margin: 0 8px 0 0;
 text-align: center;
 width: 2em;
 font-size: 120%;
 font-weight: 700;
 padding: 8px;
}

#form input.serial-text {
 width: 350px;
 font-size: 32px !important;
 font-weight: 700;
}

#form input.text {
 border: 1px solid #ccc;
 font-size: 140%;
 padding: 6px;
}

/* ----------table---------- */

#form table {
 background: #fff;
 border-collapse: collapse;
 width: 100%;
}

#form th {
 background: #f1f1f1;
 text-align: left;
 vertical-align: top;
 width: 25%;
}

#form th,
#form td {
 border: 1px solid #DDD;
 border-left: none;
 border-right: none;
 padding: 12px 18px;
}

#form table.addresstable {
 border: none;
 border-collapse: collapse;
 width: 100%;
}

#form table.addresstable th {
 background: none;
 border: none;
 font-size: 100%;
 padding: 6px 12px;
 vertical-align: middle;
 width: 120px;
 white-space: nowrap
}

#form .addresstable td {
 border: none;
 padding: 6px 12px;
 vertical-align: middle;
}

/* ----------serial---------- */

#form .serial-input {
 position: relative;
}

#form .serial-input li {
 border-bottom: 1px solid #e6e6e6;
 margin: 0 0 16px 0;
 padding: 0 16px 8px 0;
}

#form .serial-input li:last-child {
 border-bottom: none;
 margin: 0 0 0 0;
}

#form .serial-input li span {
 display: block;
 padding: 0 0 6px;
}

#form .serial-input .serial-image {
 top: 0px;
 right: 0px;
 position: absolute;
}

#form .serial-input .serial-image img {
 width: 290px;
}

#form .serial-input .answer {
 font-size: 200%;
 font-weight: 700;
 margin: -8px 0 -8px 0;
}

/* ----------store---------- */

#form .store ul li {
 list-style-type: none;
 margin: 0 0 16px 0;
 padding: 0 16px 16px 0;
 border-bottom: 1px solid #CCC;
}

#form .store ul li:last-child {
 border-bottom: none;
 padding-bottom: 0;
}

#form .store ul li strong {
 font-size: 110%;
}

#form .store ul li ul {
 list-style-type: none;
 margin: 16px 0 0 4px;
}

#form .store ul li ul span {
 display: block;
}

#form .store ul li ul li {
 border-bottom: none;
 display: inline-block;
 border-right: 1px solid #CCC;
 padding: 0 16px 0 16px;
}

#form .store .answer {
 display: block;
 margin: 0 0 16px 0;
 font-weight: 700;
}

#form .store li:last-child .answer {
 margin: 0 0 0 0;
}

#form .store li ul li {
 display: inline-block;
}

/* ----------prize---------- */

#form .prize {
 margin: 16px 16px 0 0;
}

#form .prize li {
 margin: 0 0 8px 0;
 margin: 0 0 8px 0;
 margin-left: 1.3em;
 text-indent: -1.3em;
}

#form .prize-table td {
 border: none !important;
 padding: 4px 32px 4px 0 !important;
 white-space: nowrap;
}

/* ----------enquete---------- */

#form .enquete .answer {
 margin: 16px 0 0 0;
}

#form .enquete ul li {
 margin: 0 0 8px 0;
 margin: 0 0 8px 0;
 margin-left: 1.3em;
 text-indent: -1.3em;
}

.enquete ol > li {
 padding: 0 0 12px 0;
 margin: 0 0 24px 0;
 border-bottom: 1px solid #eedbdf;
}

.enquete ol > li:last-child {
 border-bottom: none;
 margin: 0 0 0 0;
}

p.question {
 font-size: 110%;
 font-weight: 700;
 margin: 0 0 8px 0;
}

/* ----------quiz---------- */

.quiz {
 background: #fffcd9;
 font-size: 14px;
 line-height: 1.4;
 padding: 16px;
 position: relative;
}

.quiz p.note {
 bottom: 16px;
 position: absolute;
 right: 16px;
}

.quiz .quiz_answer {
 font-size: 24px;
 font-weight: 700;
 display: inline-block;
 background: #FFF;
 padding: 8px;
 margin: 16px 0 0 0;
}

/* ----------information---------- */

.HAF {
 margin: 0 0 0 20px;
 padding: 32px 0 32px 0;
 border-top: 1px solid #CCC;
}

.HAF .HAF-image {
 float: left;
 width: 300px;
}

.HAF img {
 width: 300px;
}

.HAF .HAF-text {
 float: left;
 width: 540px;
}

#form .HAF h2 {
 background: none;
 color: #0069af;
 font-size: 140%;
 text-align: left;
 margin: 0 32px;
 padding: 0;
}

.HAF p {
 margin: 8px 32px;
 line-height: 1.8;
 padding: 0;
}

.HAF a.btn {
 margin: 16px 16px 16px 32px;
 line-height: 1;
 height: auto;
 font-size: 14px;
 background: #0069af;
 display: block;
 padding: 16px;
}

.HAF a.btn:hover {
 background: #1278bc;
}

/* ----------footer---------- */

footer {
 padding: 16px 56px 56px 56px;
 margin: 16px 0 0 0;
 background: #FFF;
 position: relative;
}

p.note {
 font-size: 12px;
 margin: 16px 0 0 16px;
}

ul.note {
 font-size: 12px;
 margin: 4px 0 16px 32px;
}

ul.note li {
 font-size: 12px;
 margin: 4px 0 0 0;
}

p.approval {
 padding: 0 0 32px 0;
 margin: 0 0 0 0;
 color: #333;
 font-size: 10px;
 color: #999;
 line-height: 1.8;
}

footer img {
 width: 150px;
}

footer p {
 font-size: 10px;
 font-weight: 400;
 margin: 32px 0 0 0;
}

.clear {
 zoom: 1
}

.clear:after {
 display: block;
 visibility: hidden;
 clear: both;
 height: 0;
 content: '';
}

.inquiry {
 margin: 0 0 32px 0;
}

.inquiry .inquiry_title {
 font-weight: 700;
}

.inquiry p { 
 margin: 8px 0 0 0;
 font-size: 14px;
}

/* ----------custom---------- */

.main {
 box-sizing: border-box;
 padding: 0 0;
 background: #FFF;
 text-align: center;
}

.main img {
 width: 800px;
}

.qr_main {
 box-sizing: border-box;
 padding: 64px 32px 24px 32px;
 text-align: center;
}

.qr_main img {
 width: 640px;
}

.storename_input {
 border-right: none !important;
}

.thanks {
 padding: 32px;
}

.thanks p.note {
 margin: 16px 0 0 0;
}

.gift {
 text-align: left;
}
.gift_guide {
 margin: -32px 0 0 0;
}

.gift .code {
 background: #EEE;
 font-size: 140%;
 font-weight: 700;
 margin: 24px 0;
 padding: 16px;
 text-align: center
}

.gift .num {
 list-style-type: decimal;
 margin: 12px 0 12px 32px
}

.gift .value {
 font-size: 80%;
 font-weight: 400;
 line-height: 1;
 margin: 8px 0 0
}

.gift a {
 color: #d83358;
 text-decoration: none
}

.gift h3 {
 font-weight: 700;
 margin: 24px 0 0
}

.gift-image {
 border-bottom: 1px solid #CCC;
 margin: 16px 0;
 padding: 16px 0;
 text-align: center
}

.gift-image img {
 width: 400px
}

.gift-notice {
 display: block;
 font-size: 60%;
 font-weight: 400
}





.howto .ejoica,
.howto .nanaco,
.howto .edy,
.howto .waon {
 border: 1px solid #EEE;
 padding: 0 16px 16px 16px;
 border-radius: 8px;
 margin: 32px 0 0 0;
}

.howto h3 {
 color: #69ac36;
 border-bottom: 2px solid #69ac36;
 padding: 8px;
 font-size: 18px;
 margin: 0 0 0 0;
}

.howto .image {
 text-align: center;
 padding: 16px;
}

.howto .image img {
 width: 320px;
}

.howto .ejoica h4 {
 background: #69ac36;
 color: #FFF;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .ejoica h5 {
 background: #ffeb02;
 color: #333;
 font-size: 13px;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .ejoica p {
 color: #333;
 font-size: 13px;
 padding: 16px 16px;
}

.howto .nanaco h4 {
 background: #ff8200;
 color: #FFF;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .nanaco h5 {
 background: #ffed27;
 color: #333;
 font-size: 13px;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .nanaco p {
 color: #333;
 font-size: 13px;
 padding: 16px 16px;
}

.howto .edy h4 {
 background: #0e0046;
 color: #FFF;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .edy h5 {
 background: #00a0e9;
 color: #FFF;
 font-size: 13px;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .edy p {
 color: #333;
 font-size: 13px;
 padding: 16px 16px;
}

.howto .waon h4 {
 background: #e93102;
 color: #FFF;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .waon h5 {
 background: #2ca3db;
 color: #FFF;
 font-size: 13px;
 padding: 8px 16px;
 border-radius: 4px;
 font-weight: 700;
 margin: 16px 0 0 0;
}

.howto .waon p {
 color: #333;
 font-size: 13px;
 padding: 16px 16px;
}

.accordion span {
 display: block;
 background: url(../images/arrow_bottom.png) no-repeat right center;
 background-size: 12px auto;
}

.accordion-open span {
 display: block;
 background: url(../images/arrow_up.png) no-repeat right center;
 background-size: 12px auto;
}

.howto .ejoica h4 {
 margin: -16px -16px 0 -16px;
 padding: 12px 16px;
 border-radius: 4px 4px 0 0;
}

.howto .nanaco h4.accordion,
.howto .edy h4.accordion,
.howto .waon h4.accordion {
 margin: -16px;
 padding: 12px 16px;
}

.howto .nanaco h4.accordion-open,
.howto .edy h4.accordion-open,
.howto .waon h4.accordion-open {
 margin: -16px -16px 0 -16px;
 padding: 12px 16px;
 border-radius: 4px 4px 0 0;
}
.ejoica_guide {
 text-align: center;
 margin: -16px 0 48px 0;
}