/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.24col.css");

/* fonts */
.font12 {
  font-size:12px !important;
}
.font14 {
  font-size:14px !important;
}
.font16 {
  font-size:16px !important;
}
.font18 {
  font-size:18px !important;
}
.partTitle {
  font-weight: bold;
  margin: 0 0 5px 0;
}
#pform dl dd span {
  color: #bf9a67;
  font-weight: bold;
}
.caption {
  font-weight: bold;
  text-align: center;
}
.dline {
  font-size: 18px;
}
.centerText {
  text-align: center;
}
.bold {
  font-weight: bold;
}
/* STYLES */
html {
  height: 100%;
}
body {
  font-family:Helvetica, Arial, 'Hiragino Kaku Gothic ProN', '�q���M�m�p�S ProN W3', Meiryo, ���C���I, sans-serif;
  color: white;
  font-size:16px;
  line-height: 1.5em;
  height: 100%;
  background: #000000;
  word-break: break-all;
}

header {
  text-align: center;
  background: transparent;
}

section {
  text-align: center;
  background: transparent;
}

footer {
  text-align: center;
  background: transparent;
}

/* tags */
 
h1{

}
h2{
  font-weight: bold;
  margin: 30px 0 0 0;
  padding: 17px 0;
}
h3{
  font-weight: bold;
  margin: 20px 0 0 0;
  font-size:110%;
}
p{
  line-height: 1.5em;
  margin: 4px 0;
}
img {
  max-width: 100%;
}

.container{
  height: auto;
  width: 100%;
  background: #0d3380 url("../img/bg_pay.png") center center repeat-y;
}

.innerHeader,.innerMain,.innerFooter{
  max-width:800px;
  text-align: left;
  margin: 0 auto;
}
.innerHeader {
  line-height: 0;
}
#push-mag2 .innerMain {
  background: transparent url("../img/bg_black.png") 0 0 no-repeat;
  background-size: 100%;
}
#pay_sg .innerMain,
#pay_child .innerMain,
#free_sg .innerMain {
  background: transparent;
  background-size: 100%;
}

#success .innerMain,
#failure .innerMain {
  margin-top: 40px;
  min-height:700px;
  
}

/* header */
.navigation {
  background: transparent;
  padding: 4px;
}
.navigation img.positionLeft {
  float:left;
}
.navigation img.positionRight {
  float: right;
}

.announce {
  margin: 0 auto;
  padding: 25px 0;
}
.announce img {
  display:block;
  margin: 0 auto;
}
.announce_res {
  margin: 0 auto;
  padding: 25px 10px;
}

#failure .formTitle {
  margin: 25px auto 10px;
}
.formTitle {
  margin: 0 auto 10px;
}
.formTitle img {
  display:block;
  margin: 0 auto;
}
.archiveButtons {
  margin: 30px auto 20px;
  padding: 0 13px;
}
.archiveButtons_s {
  margin: 10px auto 20px;
}
.toTop div ,
.snsButtons ,
.archiveButtons .inner {
  margin: 0 auto;
  display:block;
  width: 100%;
}
.archiveButtons .btn {
  font-size:14px;
  font-weight:bold;
  border: none;
  display: inline-block;
  float: left;
  margin: 5px 0 0 5px;
}
.archiveButtons .btn a {
  font-size: 13px;
  color: #FFFFFF;
  padding: 0.7em;
  background: #4d4d4d;
  display: block;
  line-height: 1.5;
  text-decoration: none;
}
.archiveButtons .btn a:hover {
background-color: #cccccc;
}
/*link button*/
.linkButtons {
  margin: 30px auto 20px;
  padding: 0;
}
.linkButtons .inner {
  margin: 0 auto;
  display:block;
  width: 100%;
}
.linkButtons .btn {
  font-size: 0px;
  border: none;
  display: inline-block;
  float: left;
  margin: 5px 0 0 5px;
  line-height: 1;
}
.linkButtons .btn{
  width:32%;
}
.linkButtons .btn_large{
  width:48%;
}
.linkButtons .btn img{
  width:100%;
}
.toTop {
  margin: 0 auto;
  padding: 0 18px;
}

/* social */
div.snsBox {
  margin: 20px auto;
  padding: 0 18px;
}
ul.snsButtons {
  margin: 0 auto;
}
.fb_btn .fb_iframe_widget span {
  top: -4px;
  -webkit-transform-origin:top left;
  -moz-transform-origin:top left;
  transform-origin:top left;
  -webkit-transform:scale(1.03);
  -moz-transform:scale(1.03);
  transform:scale(1.03);
  /zoom:1.03;
  overflow: hidden;
}
.snsButtons li {
  float: left;
  margin-right: 10px;
  list-style: none;
}
.tw_btn img {
  height: 20px;
  width: 60px;
}
/* form */
.read {
  padding:30px 10px 0 10px;
  margin: 60px 0 0 0;
  background: #BD3319;
  border-top: 15px solid #FF0000;
}

.Card,
.regForm {
  padding: 20px;
  margin: 0 auto;
  background: #660000 url("../img/bg_table.jpg") center center;
  border: 4px #cccccc double;
  position: relative;
  background-size: 100%;
}
.resCard {
  padding: 6px 15px;
  margin: 0 auto 30px;
  background: #660000 url("../img/bg_table_pay.png") center center;
  border: 4px #cccccc double;
  position: relative;
  background-size: 100%;
}
.innerRegform {
  margin-top: 15px;
  width: 100%;
  top:130px;
}
.regForm input[type="text"] {
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid #cccccc;
  display: block;
  box-shadow: inset 0 1px 1px #e1e1e1;
  box-sizing: border-box;
  font-size: 100%;
  padding: 10px;
  height: 40px;
  background-color: #ffffff;
  margin: 0 auto;
  width: 95%;
}
.regForm textarea {
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid #cccccc;
  display: block;
  box-shadow: inset 0 1px 1px #e1e1e1;
  box-sizing: border-box;
  font-size: 100%;
  padding: 10px;
  height: 15.2em;
  background-color: #ffffff;
  line-height: 1.3;
  margin: 0 auto;
  width: 95%;
}
.regForm input[type="text"]:focus,
.regForm textarea:focus {
  outline: none;
  background-color: #ffffff;
  box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #cccccc, 0 0 40px #cccccc;
  -moz-box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #cccccc, 0 0 40px #cccccc;
  -webkit-box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #cccccc, 0 0 40px #cccccc;

}
input::-webkit-input-placeholder {
  color: #000000;/*for Webkit*/
}
input:-moz-placeholder {
  color: #000000;/*for Firefox*/
}
.regForm input[type="image"] {
  display: block;
  max-width: 242px;
  font-size:0;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  outline: none;
  margin: 20px auto;
}
.regForm input[type="image"]::before,
.regForm input[type="image"]::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.regForm input[type="image"],
.regForm input[type="image"]::before,
.regForm input[type="image"]::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.regForm input[type="image"]:hover {
  cursor:pointer;
}
.regForm .extxt {
  background: #4d0000;
  margin:0 auto;
  padding: 20px;
}
/* corner decoration */
.resCard .cornerbg{
  height:70px;
  width:70px;
}
.resCard .cornerbg img{
  height:70px;
  width:70px;
}
.resCard .bg_tl{
  position:absolute;
  top: 0px;
  left: 0px;
}
.resCard .bg_tr{
  position:absolute;
  top: 0px;
  right: 0px;
}
.resCard .bg_bl{
  position:absolute;
  bottom: 0px;
  left: 0px;
}
.resCard .bg_br{
  position:absolute;
  bottom: 0px;
  right: 0px;
}

.extxt a,
.extxt span {
  color: #cccccc;
}
.extxt .maru {
  padding-left:10px;
}

.kiyaku,
.emailForm,
.submitForm {
  margin: 0 auto;
}
.submitForm {
  width:36.25%;
}
.kiyaku,
.emailForm {
  width:91.5%;
}
.displayNone{
  display: none;
}
#likeBannerOff{
  padding:8px 59px;
}
#pform>dd {
  margin-bottom: 20px;
  text-align: right;
}
#pform .ext01 dd {
  font-size: 87.5%;
}
#pform .bft {
  font-size: 12px;
  margin:0 14px;
  text-align: right;
}
.necessary {
  color: #cccccc;
}
.charm {
  background: transparent url("../img/i_charm.png") 0 0 no-repeat;
  padding: 6px 0 0 33px;
  
}
.separator {
  height: auto;
  width: 100%;
  margin: 20px auto;
  padding: 17px;
  background: transparent url("../img/line.png") center center no-repeat;
  background-size: 70%;
}
.upperArchive {
  padding: 20px;
  margin: 0 auto;
}
/* success */
.Card {
  margin: 0 auto;
  padding: 25px 15px;
}
.resCard img,
.Card img {
  display:block;
  margin: 0 auto;
}

/* footer */
.innerFooter {
  background: transparent url("../img/bg_footer.jpg") 0px bottom no-repeat;
  background-size: 100%;
  min-height:140px;
}
#aor .innerFooter {
  background: transparent;
  min-height:140px;
}
.copyrightContain {
  text-align: center;
}
.copyright {
  margin: 0 auto;
  padding-left: 20px;
  display: inline-block;
}

.copyright div {
  float:left;
  display:block;
}
.footerLogo p {
  text-align:center;
}

/*��������������������������������������

  ����������������

/*��������������������������������������*/
#pay_child .medalist {
  margin:0 0 20px;
}
.medalist .title_top {
  font-size:24px;
  line-height:1.6;
  font-weight:bold;
  border-bottom: 3px solid #cccccc;
  margin:15px 0px 1px;
  padding-left: 15px;
}
.medalist .title_top > span {
  font-size:14px;
  margin-right:5px;
}
.medalist .mag_title {
font-size: 24px;
line-height: 1.3;
font-weight: bold;
border-bottom: 4px #cccccc double;
margin: 0;
padding: 30px 0 15px;
}
.prize .title_top {
  font-size:18px;
  line-height:1.6;
  font-weight:bold;
  margin:15px 0px 1px;
  padding-left: 15px;
}
.prize .title_top > span {
  font-size:16px;
}
.categoly {
display: inline;
font-size: 14px;
color: #D8D8D8;
}
.title_num {
display: inline;
font-size: 20px;
}

.prize_unit {
background: #4d0000;
padding:10px;
margin:10px auto 10px;
}

.prize_unit .recommender_comment {
background: transparent;
margin: 0 0 5px;
padding: 0 5px;
float: none;
border-top: 1px solid #cccccc;
}
.prize .mag_title{
display: inline;
padding: 0;
font-size:18px;
line-height:1.3;
font-weight:bold;
margin:0;
}
.reg_link{
display: block;
float: none;
margin: 0 auto;
}
.reg_link a{
font-size:15px;
color: #ffffff;
border: 1px solid #BB7A2E;
padding: 2px 3px;
background: #8c0000;
display: block;
line-height: 1.5;
text-align: center;
text-decoration: none;
}
.reg_link a:hover{
color: #ffffff;
border: 1px solid #FFA63F;
padding: 2px 3px;
background: #AD0202;
}
.recommender_comment {
background: #0a1433;
margin: 10px auto;
padding:10px;
float: none;
}
.author_comment {
background: #999999;
margin: 0 auto 10px;
padding: 5px 10px;
float: right;
position: relative;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}
.author_comment:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 9px 22px 9px 0;
border-color: transparent #999999;
display: block;
width: 0;
z-index: 1;
margin-top: -9px;
left: -18px;
top: 40%;
}
.medal img{
  max-width:104px;
}
.author_img {
  max-width:150px;
  display:block;
}
.upper_author_name{
display:none;
}
.under_author_name{
display:block;
float:left;
margin:0;
padding:5px 0;
font-size:12px;
}
.ttl_genre,
.resCard img.reg_btn {
  float:none;
  margin: 0 auto;
  display: block;
}
.user_voice {
  float:left;
}

/* ��768 */
@media screen and (max-width: 768px) {

  .Card {
  width: 87.5%;
  }
  #success .innerMain,
  #failure .innerMain {
    margin-top: 30px;
  }
  #failure .formTitle {
  margin: 10px auto 10px;
  }
.mag_title {
font-size: 23px;
}
.prize .mag_title {
display: block;
width: 100%;
}
}
/* ��620 */
@media screen and (max-width: 620px) {

.author_comment:after 
{
left: -12px;
}
.mag_title {
font-size: 22px;
}
/*link button*/
.linkButtons .btn {
  margin: 10px 0 0 10px;
}
.linkButtons .btn{
  width:46%;
}
.linkButtons .btn_large {
  width: 75%;
  float:none;
  display:block;
  margin:10px auto 0;
}
.img_container {
  margin-top: 100px;
}
.medalist {
  margin:0 0 20px;
}
}
/* ��480 */
@media screen and (max-width:480px){

  .archiveButtons .inner {
  max-width: 80%;
  }
  .snsButtons {
  max-width: 100%;
  }
  .archiveButtons {
  margin: 15px auto 20px;
  padding: 0 13px;
  }
  .archiveButtons .btn {
  font-size: 14px;
  font-weight: bold;
  border: none;
  display: inline-block;
  float: left;
  margin: 5px 0 0 0;
  width: 100%;
  }
  .archiveButtons .btn a {
  color: #FFFFFF;
  padding: 0.7em;
  background: #4d4d4d;
  display: block;
  line-height: 1.5;
  text-decoration: none;
  text-align: center;
  }
  #failure .Card {
  padding: 40px;
  }
  .Card {
  margin-top: 20px;
  width: 95%;
  padding: 20px 5px 57px;
  }
  .resCard {
    margin: 0 auto 20px;
    padding: 25px 15px 40px;
  }
  .toTop > div {
  margin: 0 auto;
  display: block;
  width: 80%;
  }
  #pform .bft {
  text-align: left;
  }
  .separator {
  background-size: 100%;
  margin: 50px auto;
}
.upperArchive {
  padding: 0 20px;
  margin: 0 auto;
}
#success .innerMain,
#failure .innerMain {
  margin-top: 20px;
  min-height: 460px;
}
#failure .formTitle {
margin: 0 auto 10px;
}
.prize {
  padding-left:0;
}
.title_top {
text-align: center;
color: #F0BA63;
font-size: 30px;
margin: 0px 0px 1px;
padding-left: 0;
}
.prize .title_top{
text-align: left;
}
.prize .mag_title {
  color:#ffffff;
}
.resCard img.author_img {
  max-width: 150px;
  margin: 0 auto;
}
.resCard .medal img {
display: none;
}
.author_comment {
margin: 20px auto 10px;
float: none;
}
.author_comment:after{
border-width: 0 14px 15px;
top: -15px;
left: 50%;
margin-top: 0;
margin-left: -14px;
border-color: #999999 transparent;
}
.mag_title {
font-size: 20px;
}
.upper_author_name{
display:block;
float:left;
margin:0;
padding: 3px 0;
font-size:12px;
width: 100%;
text-align:center;
line-height: 1.5;
}
.under_author_name{
display:none;
}
.recommender_comment img{
  margin:0 auto;
}
/*link button*/
.linkButtons .btn {
  margin: 0 auto 8px;
  width:230px;
  display:block;
  float:none;
}
.linkButtons .btn img {
width: 100%;
max-width:230px;
}
.ttl_genre{
margin: 0 auto 30px;
}
.img_container {
  margin-top: 0;
}
.user_voice {
  float:none;
}
.medalist .mag_title {
padding: 15px 0 10px;
}
}