html, body {background:#0f0f0f url('/images/bg.jpg') repeat-x left top;}
body,form,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,fieldset,textarea,input,select,th,td,a,span,em
{font-family:'Open Sans', sans-serif; color:#666666; font-weight:400; font-size:12px; margin:0; padding:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal; font-weight:normal;}
caption {display:none;}
ul,dl {list-style:none;}
nav, section, article, aside, hgroup, header, footer, figure, figcaption, hr {display:block; padding:0; margin:0;}
img {border:0;}
table {border-collapse:collapse; border-spacing:0;}
a {text-decoration:none;}
a:hover {color:white;}
.hide {display:none;}
div#container {margin:0 auto; width:800px; min-height:500px; border:1px solid #444444; background:#262626; margin-top:15px;
font-size:13px;}
nav {height:95px; *height:110px; *overflow:hidden;}
nav span#logo_KO {float:left; display:inline-block; width:135px; height:55px; margin:10px 15px;
background:url('/images/logo_knight.png') no-repeat left top;}
nav span#logo_KC {float:right; display:inline-block; width:290px; height:40px; margin:18px 15px 0 0;
background:url('/images/logo_knightcash.png') no-repeat right top;}
nav span#logo_KD {float:left; display:inline-block; width:225px; height:55px; margin:10px 15px;
background:url('/images/logo_kingdom.png') no-repeat left top;}
nav span#logo_CR {float:right; display:inline-block; width:260px; height:70px; margin:0 12px 0 0;
background:url('/images/logo_kingdomCrystal.png') no-repeat right top;}
nav hr {clear:both; width:100%; border:0px solid black; border-top:1px solid black; border-bottom:1px solid #444444;}
nav ul#step {clear:both; width:100%; background:#171717; border-bottom:1px solid black; zoom:1; *position:relative; *top:-6px;}
nav ul#step:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
ul#step li {float:left; width:33.3%; height:40px; background:#171717; text-align:center;
color:#666666 font-size:11px; line-height:39px;}
ul#step li.active {color:white;}
nav ul#guide_menu {clear:both; width:100%; background:#171717; zoom:1; *position:relative; *top:-6px;}
nav ul#guide_menu:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
ul#guide_menu li {float:left; width:33.1%; height:40px; background:#171717; border-bottom:1px solid black; border-left:1px solid black;
color:#666666; font-size:11px; line-height:39px; text-align:center;}
ul#guide_menu li.active {font-weight:700; background:#262626; border-bottom:1px solid #262626; border-left:1px solid #262626;}
ul#guide_menu li.active > a {color:white;}
ul#guide_menu > li > a {font-weight:700; display:block; width:100%; margin:1px 0 0 1px; border-left:1px solid #232323; border-top:1px solid #232323;}
section.content {clear:both; margin:0 auto; min-height:350px; padding:20px 0;}
H2 {color:white; font-size:14px; font-weight:700;}
H2 span.emphasize {font-size:14px; font-weight:700; color:#1162d1;}
section.content article {margin:0 auto; width:640px; padding:10px 30px;}
article.what_KC > H2{margin-bottom:10px;}
article.what_KC > p {color:white; margin-bottom:10px;}
article.what_CR > H2{margin-bottom:10px;}
article.what_CR > p {color:white; margin-bottom:10px;}
section.guide_ko {background:url('/images/guide_bg_ko.png') no-repeat right center;}
section.guide_kd {background:url('/images/guide_bg_kd.png') no-repeat right center;}
article.guides {display:none;}
article#tab1 {display:block;}
span.imgICO_crystal {display:inline-block; width:60px; height:40px; background:url('/images/icon_crystal.png'); vertical-align:bottom;}
span.imgICO_coin {display:inline-block; width:48px; height:40px; background:url('/images/icon_coin.png'); vertical-align:bottom;}
article.guides > H2 {color:white; font-size:16px; font-weight:400; line-height:16px; margin-bottom:5px;}
article.guides > H2:first-letter {font-size:40px; font-weight:600; line-height:40px;}
article.guides > p {color:white; font-size:13px; margin-bottom:30px;}
article#tab3 > ul > li {color:white; font-size:13px; line-height:1.2em; margin:5px 0;}
article#tab3 > ul > li:before {content:"-"; padding:0 5px;}
article#tab3 > ul > li > ul {margin:8px 0 0 10%;}
article#tab3 > ul > li > ul > li {color:white; float:left; width:40%; font-size:12px; list-style-type:disc; line-height:1.1em; margin:3px 0;}
ul.howto {
background:url('/images/guide_howto_arrow.png') no-repeat center top;
-webkit-animation:how 1s steps(4) infinite;
-moz-animation:how 1s steps(4) infinite;
-ms-animation:how 1s steps(4) infinite;
-o-animation:how 1s steps(4) infinite;
animation:how 1s steps(4) infinite;
}
@-webkit-keyframes how {from { background-position:center 0;} to { background-position:center -800px;}}
@-moz-keyframes how {from { background-position:center 0;} to { background-position:center -800px;}}
@-ms-keyframes how {from { background-position:center 0;} to { background-position:center -800px;}}
@-o-keyframes how {from { background-position:center 0;} to { background-position:center -800px;}}
@keyframes how {from { background-position:center 0;} to { background-position:center -800px;}}
ul.howto:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
ul.howto li.ntt {float:left; width:200px; height:200px; background:url('/images/guide_howto.png') no-repeat left center;}
ul.howto li.steam {float:right; width:200px; height:200px; background:url('/images/guide_howto.png') no-repeat right center;}
article.ko_prices_op {margin-top:10px; text-align:center;}
ul.ko_prices_list {text-align:center; margin-bottom:10px; zoom:1;}
ul.ko_prices_list:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
ul.ko_prices_list > li {position:relative; float:left; width:18.5%; height:180px; margin-right:1.5%;}
ul.ko_prices_list > li.ko_price1 {background:url('/images/ko_charge_img1.png') no-repeat center top;}
ul.ko_prices_list > li.ko_price2 {background:url('/images/ko_charge_img2.png') no-repeat center top;}
ul.ko_prices_list > li.ko_price3 {background:url('/images/ko_charge_img3.png') no-repeat center top;}
ul.ko_prices_list > li.ko_price4 {background:url('/images/ko_charge_img4.png') no-repeat center top;}
ul.ko_prices_list > li.ko_price5 {background:url('/images/ko_charge_img5.png') no-repeat center top;}
ul.ko_prices_list > li:nth-of-type(5n) {margin-right:0;}
ul.ko_prices_list > li:before {float:left; position:absolute; content:""; display:inline-block; width:11px; height:180px; top:0; left:0;
background:url('/images/ko_price_li_bg.png') no-repeat left top;}
ul.ko_prices_list > li:after {float:right; position:absolute; content:""; display:inline-block; width:11px; height:180px; top:0; right:0;
background:url('/images/ko_price_li_bg.png') no-repeat right top;}
ul.ko_prices_list > li > span {display:block; text-align:center;}
ul.ko_prices_list > li > span.game_money {color:#888888; font-size:24px; line-height:1em; letter-spacing:-0.05em;}
ul.ko_prices_list > li > span.charge_money {color:#ff9a00; font-size:24px; line-height:1em; padding-top:120px;}
ul.ko_prices_list > li > span > em.currency{font-size:13px; padding-left:2px;}
ul.ko_prices_list > li:hover, ul.ko_prices_list > li.current {cursor:pointer;}
ul.ko_prices_list > li:hover:before, ul.ko_prices_list > li.current:before {background-position:left -200px;}
ul.ko_prices_list > li:hover:after, ul.ko_prices_list > li.current:after {background-position:right -200px;}
ul.ko_prices_list > li:hover > span.game_money, ul.ko_prices_list > li.current > span.game_money {color:#ff9a00;}
ul.ko_prices_list > li:hover > span > em.currency, ul.ko_prices_list > li.current > span > em.currency {color:#ff9a00;}
article.ko_prices_op > hr {clear:both; width:100%; border:0px solid black; border-top:1px solid #333333; margin:15px 0;}
article.kd_prices_op {margin-top:10px; text-align:center;}
ul.kd_prices_list {text-align:center; margin-bottom:10px; zoom:1;}
ul.kd_prices_list:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
ul.kd_prices_list > li {position:relative; float:left; width:18.5%; height:180px; margin-right:1.5%;}
ul.kd_prices_list > li.kd_price1 {background:url('/images/kd_charge_img1.png') no-repeat center 12px;}
ul.kd_prices_list > li.kd_price2 {background:url('/images/kd_charge_img2.png') no-repeat center 12px;}
ul.kd_prices_list > li.kd_price3 {background:url('/images/kd_charge_img3.png') no-repeat center 12px;}
ul.kd_prices_list > li.kd_price4 {background:url('/images/kd_charge_img4.png') no-repeat center 12px;}
ul.kd_prices_list > li.kd_price5 {background:url('/images/kd_charge_img5.png') no-repeat center 12px;}
ul.kd_prices_list > li:nth-of-type(5n) {margin-right:0;}
ul.kd_prices_list > li:before {float:left; position:absolute; content:""; display:inline-block; width:11px; height:180px; top:0; left:0;
background:url('/images/kd_price_li_bg.png') no-repeat left top;}
ul.kd_prices_list > li:after {float:right; position:absolute; content:""; display:inline-block; width:11px; height:180px; top:0; right:0;
background:url('/images/kd_price_li_bg.png') no-repeat right top;}
ul.kd_prices_list > li > span {display:block; text-align:center;}
ul.kd_prices_list > li > span.game_money {color:#888888; font-size:24px; line-height:1em; letter-spacing:-0.05em;}
ul.kd_prices_list > li > span.charge_money {color:#1162d1; font-size:24px; line-height:1em; padding-top:120px;}
ul.kd_prices_list > li > span > em.currency{font-size:13px; padding-left:2px;}
ul.kd_prices_list > li:hover, ul.kd_prices_list > li.current {cursor:pointer;}
ul.kd_prices_list > li:hover:before, ul.kd_prices_list > li.current:before {background-position:left -200px;}
ul.kd_prices_list > li:hover:after, ul.kd_prices_list > li.current:after {background-position:right -200px;}
ul.kd_prices_list > li:hover > span.game_money, ul.kd_prices_list > li.current > span.game_money {color:#1162d1;}
ul.kd_prices_list > li:hover > span > em.currency, ul.kd_prices_list > li.current > span > em.currency {color:#1162d1;}
article.kd_prices_op > hr {clear:both; width:100%; border:0px solid black; border-top:1px solid #333333; margin:15px 0;}
input {border:1px solid #444444; background:#333333; padding:10px 15px; font-size:14px; color:white; font-weight:300;}
select {border:1px solid #444444; background:#333333; padding:9px 15px; font-size:14px; color:white; font-weight:300;}
article.payment {}
article.payment > H2 {margin-bottom:20px;}
article.payment > input {float:left; width:50%; margin-bottom:10px;}
article.payment > button {width:40px; height:40px; border:0px solid #444444; border-top:1px solid #444444; border-right:1px solid #444444; margin-left:-40px; background-image:url('/images/btn_search.png'); background-color:#333333; cursor:pointer;}
article.payment > button:hover {background-color:#444444;}
article.payment > select.currency_country {float:right; width:40%; margin-bottom:10px; *margin-top:-40px;}
article.payment > dl.payment_method {clear:both; border-top:1px solid #444444; border-bottom:1px solid #444444; margin:10px 0; padding:10px 5px; zoom:1;}
article.payment > dl.payment_method:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
article.payment > dl.payment_method > dt {float:left; width:140px; line-height:0px;}
article.payment > dl.payment_method > dt > a {display:block; width:140px; height:140px; border:1px solid #232323;}
article.payment > dl.payment_method > dt > a:hover {border:1px solid white;}
article.payment > dl.payment_method > dd.summary {float:left; width:410px; height:130px; padding:5px 0 5px 80px; background:url('/images/payment_arrow.png') no-repeat left top;}
article.payment dd.summary > span {display:block; color:white; font-size:20px; font-weight:300; padding-bottom:15px;}
article.payment dd.summary > dl > dt {float:left; width:40%; margin-bottom:10px; color:white;}
article.payment dd.summary > dl > dd {float:right; width:55%; margin:0 5% 10px 0; text-align:right; color:white; font-size:15px;}
article.payment dd.summary > dl > dd.kc {color:#ff9b02;}
article.payment dd.summary > dl > dd.CR {color:#1162d1;}
article.payment span.btns {display:block; text-align:center;}
section.result {clear:both; margin:0 auto; min-height:350px; padding-bottom:30px;}
article.result_msg {color:white; width:90%; padding:20px 5% 25px; margin-bottom:25px;}
article.result_success {background:#63b53b;}
article.result_fail {background:#ba3640;}
article.result_msg > span.success {display:block; width:75%; padding-left:115px; margin-left:5%; color:white; font-size:35px; line-height:1.2em; font-weight:400; background:url('/images/msg_success.png') no-repeat left top;}
article.result_msg > span.fail {display:block; width:75%; padding-left:115px; margin-left:5%; color:white; font-size:35px; line-height:1.2em; font-weight:400; background:url('/images/msg_fail.png') no-repeat left top;}
article.result_msg > span.steamfail {display:block; width:75%; padding-left:115px; margin-left:5%; color:white; font-size:21px; line-height:1.2em; font-weight:400; background:url('/images/msg_fail.png') no-repeat left top; height:80px;}
article.result_msg > span.detail {display:block; width:75%; padding-left:120px; margin:15px 0 0 5%; color:white; font-size:18px; line-height:1.2em; font-weight:300;}
article.result_msg > span.detail > em {color:white; font-size:18px; font-weight:600;}
article.result_msg > span.balancedetail {display:block; width:80%; padding-left:120px; margin:0px 0 0 0%; color:white; font-size:18px; line-height:1.2em; font-weight:300; background:url('/images/msg_fail.png') no-repeat left top; height:90px;}
article.result_msg > span.support {display:block; width:75%; padding-left:120px; margin:15px 0 0 5%; color:white; font-size:12px; line-height:1.2em; font-weight:300;}
dl.receipt {margin:0 auto; width:450px; padding:10px 25px 18px; background:white; border: 0px solid #000000;
border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; -webkit-border-radius:10px 10px 10px 10px;}
dl.receipt:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
dl.receipt > dt {float:left; width:65%; padding:4px 0 4px; font-size:13px;}
dl.receipt > dd {float:left; width:35%; text-align:right; padding:4px 0 4px; font-size:13px;}
dl.receipt > .title {color:black; font-size:24px; font-weight:600; letter-spacing:-0.04em; border-bottom:1px solid #dddddd; padding-bottom:10px; margin-bottom:10px;}
.button {
display:inline-block;
zoom:1; /* zoom and *display = ie7 hack for display:inline-block */
*display:inline;
vertical-align:baseline;
margin:0 2px;
outline:none;
cursor:pointer;
text-align:center;
text-decoration:none;
font-size:11px;
padding:3px 15px 4px;
text-shadow:0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow:0 1px 2px rgba(0,0,0,.2);
box-shadow:0 1px 2px rgba(0,0,0,.2);
}
.green {
color:white;
border:1px solid #538312;
background:#64991e;
background:-webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
background:-moz-linear-gradient(top, #7db72f, #4e7d0e);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
background:#538018;
background:-webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
background:-moz-linear-gradient(top, #6b9d28, #436b0c);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.green:active {
color:white;
background:-webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
background:-moz-linear-gradient(top, #4e7d0e, #7db72f);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}
.gray {
color:white;
border:1px solid #555;
background:#6e6e6e;
background:-webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
background:-moz-linear-gradient(top, #888, #575757);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
background:#616161;
background:-webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
background:-moz-linear-gradient(top, #757575, #4b4b4b);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
color:white;
background:-webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
background:-moz-linear-gradient(top, #575757, #888);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}
footer {clear:both; width:100%; height:45px; background:#171717; border-top:1px solid black;}
footer > span#logo_nttgame {float:left; display:inline-block; width:20%; height:30px; margin:7px 2.5% 0 2.5%;
background:url('/images/logo_nttgame.png') no-repeat right top;}
footer > span > a {color:white; text-decoration:underline;}
footer > span.go_guide {float:right; width:70%; font-size:11px; font-weight:400; line-height:15px; margin:5px 2% 0 2%;}
footer > span.go_charge {float:right; width:60%; font-size:11px; font-weight:400; line-height:13px; margin:14px 10% 0 0; text-align:right; color:white;}
@media screen and (max-width:700px) {
div#container {width:700px;}
footer > span#logo_nttgame {width:110px; margin:7px 25px 0 25px;}
footer span.go_guide {float:left; width:72%; margin:5px 0 0 0;}
}
@media screen and (min-width:701px) and (max-width:799px) {
div#container {width:98%;}
footer > span#logo_nttgame {width:110px; margin:7px 25px 0 40px;}
footer span.go_guide {float:left; width:72%; margin:5px 0 0 0;}
}
/* popup layer */
.popup_layer {
background: url(/images/shade.png);
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.popup_layer .window {
background-color: #252525;
border: 1px solid #464646;
height: 100px;
margin: 0 auto;
padding: 20px 26px;
position: relative;
top: 150px;
width: 400px;
}
.popup_text {
color: #999999;
line-height: 1em;
text-align: center;
}
.popup_button_container {
bottom: 20px;
position: absolute;
text-align: center;
width: 400px;
}