
/************************************************************************************
RESET
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
}

img, fieldset { border: 0; }

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}

html, body, input, textarea, div, td, th { }

/************************************************************************************
GENERAL STYLING
*************************************************************************************/
body { line-height:100%; }
a { text-decoration: none; outline: none; }
a:hover { text-decoration: underline; }
p { line-height:130%; }
input, textarea { }

/* headings */
h1, h2, h3, h4, h5, h6 { line-height:125%; }
h1 {font-size: 100%; }
h2 {font-size: 200%; }
h3 {font-size: 140%; }
h4 {font-size: 100%; }
h5 {font-size: 90%; }
h6 {font-size: 80%;  }

/* reset webkit search input styles */
input[type=search] {
	-webkit-appearance: none;
	outline: none;
}
input[type="search"]::-webkit-search-decoration, 
input[type="search"]::-webkit-search-cancel-button {
	display: none;
}

/* embedded videos */
.video embed,
.video object,
.video iframe {
	width:100%;
	height:auto;
	min-height:50px;
}

/* link */
a.btn:link    { color: #000050; text-decoration: none; }
a.btn:visited { color: #000050; text-decoration: none; }
a.btn:hover   { color: #808080; text-decoration: underline; position:relative;top:2px;left:2px; }

/*--------------------------------------------------------
size & pos
--------------------------------------------------------*/
body		{ text-align: center; margin: 0px; padding:0px; }
.container	{ width:100%; text-align:left;   margin:0px auto; padding:0px; }
.main		{ width:100%; text-align:left;   margin:0px; padding:0px; float:none; }
.menu		{ width:100%; text-align:center; margin:0px; padding:0px; float:none; }
.kmain		{ width:100%; float:none; text-align:center; }
.kmenu		{ width:100%; float:none; }

.header		{ margin: 0px; padding: 0px; line-height:0%;   text-align:center; }
.footer		{ margin: 0px; padding: 0px; line-height:100%; text-align:center; }
.block		{ margin: 4px; padding: 0px; border: 1px solid ; }
.box		{ margin: 5px; padding: 0px; 
			  border-radius:10px;			/* CSS3‘ˆÄ */
		      -webkit-border-radius:10px;	/* Safari,Google Chrome—p */
		      -moz-border-radius:10px;		/* Firefox—p */
}
.rect		{ margin: 5px; padding: 0px; }

p { padding:10pt; }
h1 { text-align:right; padding:auto 2pt; margin:0; }
h2, h3, h4, h5, h6 { padding:5pt; margin:0; }
td,th { padding:2pt 5pt; }
th { text-align:center; }


/*--------------------------------------------------------
Color
--------------------------------------------------------*/
body		{ background-color: #999900; }
.container	{ background-color: #FFFFD1; }
.main		{ background-color: #FFFFD1; }
.menu		{ background-color: #FFFFD1; }
.header		{ background-color: #FFFFD1; }
.footer		{ background-color: #FFFFFF; }
.block		{ background-color: #ffffff; border-color: #8B8B1D; }
.box		{ background-color: #ffffff; }
.rect		{ }

body	  { color: #303030; }
a:link    { color: #103591; text-decoration: none; }
a:visited { color: #103591; text-decoration: none; }
a:hover   { color: #051F5F; text-decoration: underline; }

h1 { }
h2 { }
h3 { }
h4 { border-left:5pt solid #EBEB84; background-color:#999900; color:#ffffff; }
h5 { background-color:#999900; color:#ffffff; }
h6 { }


/* @group menu */
.topmenu{
	margin:0;
	border-bottom:solid 1px #BABDB9;
	height:6.5rem; list-style-type:none; text-align:center; line-height:150%;
}

.topmenu li{
	background-color: #f8f8f8; 
	background-image: -moz-linear-gradient(top, #FFF, #EBEBEB);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#FFF), to(#EBEBEB));
	background-image: -o-linear-gradient(top, #FFF, #EBEBEB);
	background-image: linear-gradient(top, #FFF, #EBEBEB);
	overflow:hidden;
	float:none;
	width:100%;
	position:relative;
	height:1.5rem;
	border-top:solid 1px #BABDB9;
	border-bottom:solid 1px #F5F5F5;
}

.topmenu a{
	background:url('//cashbacker.ioiv.net/obj/arrow.png') no-repeat 100% 50%;
	display:block;
	text-decoration:none;
	font-size:100%;
	color:#000000;
	padding:0.1rem;
}
.topmenu a:hover { background:#ffffff; color:#000000; }

/* @end */

/* embedded videos */
.video embed,
.video object,
.video iframe {
	width:100%;
	height:auto;
	min-height:250px;
}

/************************************************************************************
over than 980 for PC
*************************************************************************************/
@media screen and (min-width: 941px) {

body		{ text-align: center; margin: 0px; padding:0px; }
.container	{ width:940px; text-align:left; margin:0px auto; padding:0px; }
.main		{ width:590px; text-align:left; margin:0px; padding:0px; float:left; }
.menu		{ width:350px; text-align:left; margin:0px; padding:0px; float:right; }
.kmain		{ width:50%; text-align:right;  margin:0; padding:0; float:left;  vertical-align:middle; }
.kmenu		{ width:50%; text-align:center; margin:0; padding:0; float:right; vertical-align:middle; }
.topmenu   	{ height: 1.5rem; }
.topmenu li	{ float:left; width:25%; }

}

/************************************************************************************
smaller than 980 for small-PC
*************************************************************************************/
@media screen and (max-width: 940px) and (min-width: 801px) {

body		{ }
.container	{ width:100%; text-align:left;   margin:0px auto; padding:0px; }
.main		{ width:65%; text-align:left;   margin:0px; padding:0px; float:left; }
.menu		{ width:35%; text-align:center; margin:0px; padding:0px; float:right; }
.kmain		{ width:50%; text-align:right;  margin:0; padding:0; float:left;  vertical-align:middle; }
.kmenu		{ width:50%; text-align:center; margin:0; padding:0; float:right; vertical-align:middle; }
.topmenu   	{ height: 1.5rem; }
.topmenu li	{ float:left; width:25%; }

}

/************************************************************************************
smaller than 600 for tablet
*************************************************************************************/
@media screen and (max-width:800px) {

body		{ }
.container	{ width:100%; text-align:left;   margin:0px auto; padding:0px; }
.main		{ width:100%; text-align:left;   margin:0px; padding:0px; float:none; }
.menu		{ width:100%; text-align:center; margin:0px; padding:0px; float:none; }
.kmain		{ width:50%; text-align:right;  margin:0; padding:0; float:left;  vertical-align:middle; }
.kmenu		{ width:50%; text-align:center; margin:0; padding:0; float:right; vertical-align:middle; }
.topmenu   	{ height: 1.5rem; }
.topmenu li	{ float:left; width:25%; }

}

/************************************************************************************
smaller than 480 for smartphone
*************************************************************************************/
@media screen and (max-width:470px) {

body		{ }
.container	{ width:100%; text-align:left;   margin:0px auto; padding:0px; }
.main		{ width:100%; text-align:left;   margin:0px; padding:0px; float:none; }
.menu		{ width:100%; text-align:center; margin:0px; padding:0px; float:none; }
.kmain		{ width:100%; float:none; text-align:center; }
.kmenu		{ width:100%; float:none; }

/* @group menu */
.topmenu    { height: 3.2rem; }
.topmenu li { float:left; width: 50%; }

/* @end */
}
