@charset "shift_jis";

/*===================================================================
------------------
Table Of Contents
------------------
 00) Common
===================================================================*/

/*-------------------------------------------------------------------
 00) friend
-------------------------------------------------------------------*/

.friend #contentsFull { margin-top: 25px; }
.friend #contentsFull .inr {
	margin: 0 auto;
	position: relative;
	width: 960px; height: 203px;
}
.friend #contentsFull h1,
.friend #contentsFull ul { position: absolute; }
.friend #contentsFull h1 { top: 0; left:0; }
.friend #contentsFull ul { top: 163px; left: 0; }
.friend #contentsFull li {
	padding-left: 15px;
	float: left;
}

.friend #contentsArea,
.friend #contentsArea h2 { margin-top: 40px; }

.friend .articleArea { padding-bottom: 50px; }

.friend .hero {
	 position: relative;
}
.friend .hero .heroNote {
	position: absolute;
	top: 285px; left: 27px;
}

#hpyMenu { margin-top: 10px; }
#hpyMenu li {
	padding-right: 32px;
	float: left;
}
#hpyMenu p { margin-top: 10px; }

#offerFlow { margin-top: 50px; }
#offerFlow .corner5px {	margin-top: 10px; }
#offerFlow .corner5px h4 {
	margin: 1px 1px 10px;
	padding: 10px 0 10px 8px;
	background: #ffebeb;
}

#offerFlow .corner5px.max {
	float: left;
	width: 455px;
	margin-right: 15px;
	padding-bottom: 150px;
	position: relative;
}

#offerFlow .steps { margin-bottom: 5px; }
#offerFlow .steps p { margin-left: 8px; }
#offerFlow .steps dl {
	margin: -60px 0 0 107px;
	width: 300px;
}
#offerFlow .steps dd { margin-top: 10px; }

#offer1 .step1,
#offer2 .step1,
#offer2 .step2 {
	background: url(../../friend/images/bg_arw.gif) no-repeat 39px bottom;
}

#offer2 .step1 { padding-bottom: 38px; }
#offer2 .step2 { padding-bottom: 25px; }

#offer1 .step2 {
	padding-bottom: 103px;
	background: url(../../friend/images/offer1_step2_bg.gif) no-repeat 114px bottom;
}
#offer2 .step2 .inr {
	padding-bottom: 10px;
	background: url(../../friend/images/offer2_step2_bg.gif) no-repeat 333px 33px;
}

#offerFlow .btn,
.friend #introduceBtn {
	margin-top: 20px;
	text-align: center;
}
#offerFlow .clickSelect,
#offerFlow ul { position: absolute; }
#offerFlow .clickSelect { left: 34px; top: 493px; }
#offerFlow ul { left: 110px; top: 556px;}
#offerFlow li {
	margin-bottom: 5px;
}

.friend #confirmTxt { margin-top: 50px }
.friend #confirmTxt strong{color:#f00;font-weight:bold;}
.friend #confirmTxt h3 {
	margin: 1px;
	padding: 14px 11px;
	background: #f3f3f3;
}
.friend #confirmTxt p { padding: 15px; }
.friendPresent{margin-top:35px;}
/*-------------------------------------------------------------------
 01) LightBox common
-------------------------------------------------------------------*/
#scroll {
	width: 816px;
	height: 480px;
	/*
	overflow-y: scroll;
	*/
	font-size: 12px;
	line-height: 1.5;
}
#scroll .inr { padding: 8px; }
#pop1, #pop2, #pop3 {
	padding-bottom: 15px;
	border-bottom: solid 1px #aaa;
}

#scroll h2 { margin: 13px 0 10px; }
#stepFlow { margin-top: 10px; }
#stepFlow .steps { padding-top: 10px; }
#stepFlow .steps dl { margin: -60px 0 0 98px; }
#stepFlow .steps dd { margin-top: -15px; }
#stepFlow .steps dd p,
#stepFlow .steps dd ol { margin-top: 25px; }
#stepFlow .steps dd span { font-size: 10px; }
#stepFlow .steps dd ul li {
	margin-left: 1em;
	text-indent: -1em;
	font-size: 10px;
}
#stepFlow .steps dd ol li {
	padding: 2px 0 0 21px;
	background-position: 0 0;
	background-repeat: no-repeat;
}
#stepFlow .steps dd ol li.num1 { background-image: url(../../friend/images/icon_n1.gif); }
#stepFlow .steps dd ol li.num2 { background-image: url(../../friend/images/icon_n2.gif); }
#stepFlow .steps dd ol li.num3 { background-image: url(../../friend/images/icon_n3.gif); }
#stepFlow .steps dd ol li em {
	margin-top: 15px;
	display: block;
	color: #ff0000;
}
#stepFlow .steps dd ol li em span { font-size: 12px; font-weight: bold; }
#stepFlow .steps dd .send { text-align: center; }

#scroll h3 { margin-top: 35px; }
#scroll #regist {
	margin-top: 20px;
	padding: 12px 0;
	background: transparent url(../../friend/images/bg_regist.gif) 0 0 no-repeat;
}
#scroll #regist li { text-align: center;}
#scroll ul.note {
	margin: 15px 0 0 10px;
	font-size: 10px;
}

/*-------------------------------------------------------------------
 02) LightBox pop1
-------------------------------------------------------------------*/