@charset "utf-8";
@media print {
html, body {
	display: none;
}
}
#gl_mainContentsOuter {
	float:none;
	width:1004px;
	margin:0 auto;
	background-image:none;
	background-color:#fff;
	background:url(img/xmasBG.gif) 0 0 repeat-y;/* /promo/FREE/newfreejoin/gl_mainBg_freejoinpageCompensationB.gif */
}
.det{
	position:relative;
	width:998px;
	padding:0;
	margin:0 auto;
	background-color:#003a0d;
	box-sizing:border-box;
	font-family:"メイリオ", Meiryo, sans-serif;
	font-size:14px;
}
.det div{
	width:100%;
	margin:0;
	background-position:0 0;
	background-repeat:no-repeat;
}
#howto{
	position:relative;
	width:900px;
	padding:0.5em;
	margin:0 auto;
	background:rgba(0,0,0,0.6);
	border:#f00 0.5em solid;
	border-radius:0.5em;
	color:#fff;
	
}
#howto h2{
	position:absolute;
	left:0;
	top:-0.7em;
	width:100%;
	color:#ff0;
	font-size:2.2em;
	font-weight:bold;
	text-align:center;
	text-shadow:#330 0 2px 2px, #330 0 -2px 2px, #330 2px 0 2px, #330 -2px 0 2px;
}
#howto h3{
	margin:0.5em 0;
	color: #f00;
	font-size:1.5em;
	font-weight:bold;
	text-align:left;
	text-shadow:#fff 0 1px 0px, #fff 0 -1px 0px, #fff 1px 0 0px, #fff -1px 0 0px;
}
#howto section{
	overflow:hidden;
}
#howto article{
	display:block;
	float:left;
	width:calc(450px - 1em);
	margin:0.5em;
	text-align:left;
}
#howto a{
	color:#f69;
}
#howto img{
	display:block;
	margin:0.5em auto;
	border-radius:0.5em;
}
.yel{
	color:#ff0;
	font-weight:bold;
}
#chart{
	position:relative;
	padding-bottom:5em;
}
#chart table{
	width:97%;
	margin:1em auto;
}
#chart table th, #chart table td{
	padding:1em;
	border:#08251a 1px solid;
	border-collapse:collapse;
	font-size:1.5em;
	color:#000;
	text-align:center;
}
#chart table th{
	font-weight:bold;
}
#chart table th:first-child{
	width:20%;
	border:none;
}
#chart table th div{
	padding:0.25em 0;
	margin-bottom:0.5em;
	background:rgba(0,0,0,0.8);
	border-radius:0.25em;
	color:#fff;
}
#chart table tr:nth-child(2) td{
	background:rgba(255,255,255,0.9);
}
#chart table tr:nth-child(2) td:first-child{
	padding-left:0;
	padding-right:0;
	background:rgba(255,246,168,0.9);
	font-size:1.8em;
	font-weight:bold;
}
#chart table tr:last-child td{
	padding:0.5em;
	background:rgba(255,153,153,0.9);
	font-weight:bold;
	color:#fff;
}
#chart table tr:last-child td:first-child{
	background:rgba(255,255,255,0.9);
	color:#000;
}
.exp{
	list-style:disc;
	margin:2em 0 1.5em 2em;
	text-align:left;
}
.exp li{
	margin-bottom:0.5em;
}
.bubble{
	position:relative;
	vertical-align:middle;
	padding:0.5em;
	margin-right:0.5em;
	background:rgba(0,0,0,0.8);
	border-radius:0.25em;
}
.bubble:after{
	content:"";
	position:absolute;
	top:0.6em;
	right:-0.5em;
	border-left:rgba(0,0,0,0.8) 0.5em solid;
	border-top:transparent 0.5em solid;
	border-bottom:transparent 0.5em solid;
}
.balloonArea{
	position:absolute;
	right:1.5%;
	bottom:1.75rem;
	display:block;
	width:77%;
}
.coupon{
	position:relative;
	line-height:1.5em;
}
.coupon img{
	position:absolute;
	bottom:-1.25em;
	left:calc(50% - 50px);
}
.balloon{
	position:relative;
	display:block;
	width:90%;
	padding:0.5em 0;
	margin:0 auto;
	background:rgba(255,255,255,1);
	border-radius:0.5em;
	box-shadow:rgba(0,0,0,0.5) 2px 2px 8px;
	color:#f00;
	font-size:1.5em;
	font-weight:bold;
	letter-spacing:0.1em;
	text-align:center;
	
}
.pointer{
	position:absolute;
	top:-1rem;
	display:block;
	border-bottom:rgba(255,255,255,1) 1rem solid;
	border-left:transparent 0.75rem solid;
	border-right:transparent 0.75rem solid;
}
.lp{
	left:3em;
}
.cp{
	left:calc(50% - 0.5rem);
}
.rp{
	right:3em;
}
.smallTxt{
	font-size:0.5em;
}
.mediumTxt{
	font-size:1.2em;
}
.largeTxt{
	font-size:1.4em;
}
.sn{
	padding:0;
	margin:0;
	font-size:0.9em;
	text-align:right;
}
.enh{
	margin-right:0.15em;
	font-style: oblique;
}
.splash{
	display:inline-block;
	width:64px;
	height:64px;
	background:url(img/splash.png);
	background-position:center;
	background-repeat:no-repeat;
	line-height:64px;
	text-align:left;
	text-shadow:rgba(0,0,0,0.5) 1px 1px 2px;
}
#note{
	position:relative;
	height:210px;
}
#note ul{
	position:absolute;
	bottom:1em;
	left:25%;
	list-style:none;
	padding-left:2em;
	margin:0;
	color:#fff;
	font-size:12px;
	text-align:left;}
#note li{
	text-indent:-1.5em;
	margin-bottom:0.5em;
}
#note li a{
	color:#ff0;
	text-decoration:underline;
}
#note li:before{
	content:"※ ";
}
#note li:first-child{
	margin-bottom:1.25em;
	text-indent:-2em;
}
#note li:first-child:before{
	content:none;
}