@charset "UTF-8";



/* ================================================================================
/* 	TSUTAYA オンラインゲーム利用規約
/* ================================================================================ */
.tog_contents .main.wide .inner_main {
	margin-bottom: 0;
}

/* paragraph
/* -------------------------------------------------------------------------------- */
.inner_main > .paragraph {
	margin-bottom: 20px;
}
.inner_main .base_box .body > .paragraph {
	margin: 20px 0;
}
.base_box > .body.paragraph {
	padding: 20px;
}
.inner_main .paragraph p + p {
	margin-top: 10px;
}
.body > ul.decimal,
.body > ul.disc {
	margin: 20px;
}
.body > .rule_list a:hover {
	color: #999;
}

/* ul
/* -------------------------------------------------------------------------------- */
ul.disc {
	margin-left: 0;
}
ul.decimal li,
ul.disc > li {
	line-height: 1.5;
}
ul.decimal li ~ li,
ul[class^="disc"] > li ~ li {
	margin-top: 10px;
}
ul.decimal > li {
	margin-left: 20px;
	list-style-type: decimal;
}
ul.disc > li{
	position: relative;
	padding-left: 15px;
}
ul.disc > li:before {
	content:"・";
	position: absolute;
	top: 0;
	left: 0;
}
ul.disc_l {
	margin-left: 15px;
}
ul.disc_l > li {
	list-style-type: disc;
}
ul li > ul {
	margin: 10px 0 10px 15px;
}
ul.counts {
	counter-reset: listCount;
	margin-left: 6px;
}
ul.counts > li {
	position: relative;
	counter-increment: listCount;
	padding-left: 30px;
}
ul.counts > li:before {
	content: "（" counter(listCount) "）";
	position: absolute;
	top: 0;
	left: 0;
}
ul.lower-latin {
	margin-left: 36px;
}
ul.lower-latin li {
	list-style-type: lower-latin;
}
ul.circle {
	margin-left: 0;
}
ul.circle > li {
	position: relative;
	padding-left: 18px;
}
ul.circle > li:before {
	position: absolute;
	top: 0;
	left: 0;
}
ul.circle > .list1:before {
	content: "\2460";
}
ul.circle > .list2:before {
	content: "\2461";
}
ul.circle > .list3:before {
	content: "\2462";
}
ul.circle > .list4:before {
	content: "\2463";
}
ul.circle > .list5:before {
	content: "\2464";
}
ul.circle > .list6:before {
	content: "\2465";
}
ul.circle > .list7:before {
	content: "\2466";
}
ul.circle > .list8:before {
	content: "\2467";
}
ul.circle > .list9:before {
	content: "\2468";
}
ul.circle > .list10:before {
	content: "\2469";
}
ul.circle > .list11:before {
	content: "\246A";
}
ul.rule_list li > dl dd {
	margin: 10px 0;
}
ul.count_close {
	counter-reset: closeCount;
}
ul.count_close > li {
	position: relative;
	counter-increment: closeCount;
	padding-left: 18px;
}
ul.count_close > li:before {
	content: counter(closeCount) "）";
	position: absolute;
	top: 0;
	left: 0;
}
dl + ul.disc {
	padding-left: 12px;
}
dl + ul.disc li span + span {
	padding-left: 12px;
}
.other_conts p + p {
	text-align: right;
}
ul.katakana > li{
	position: relative;
    padding-left: 35px;}
ul.katakana > li:before {
    position: absolute;
    top: 0;
    left: 0;
}
ul.katakana > .list1:before{
	content:"(ア)"}
ul.katakana > .list2:before{
	content:"(イ)"}
ul.katakana > .list3:before{
	content:"(ウ)"}
ul.katakana > .list4:before{
	content:"(エ)"}
ul.katakana > .list5:before{
	content:"(オ)"}
ul.katakana > .list6:before{
	content:"(カ)"}
ul.katakana > .list7:before{
	content:"(キ)"}
ul.katakana > .list8:before{
	content:"(ク)"}
ul.katakana > .list9:before{
	content:"(ケ)"}
ul.katakana > .list10:before{
	content:"(コ)"}
ul.katakana > .list11:before{
	content:"(サ)"}
	
ul.parentheses > li{
	position: relative;
    padding-left: 35px;}
ul.parentheses > li:before {
    position: absolute;
    top: 0;
    left: 0;
}
ul.parentheses > .list1:before{
	content:"(1)"}
ul.parentheses > .list2:before{
	content:"(2)"}
ul.parentheses > .list3:before{
	content:"(3)"}

/* ================================================================================
/* 	附則
/* ================================================================================ */
.addRule{
	border-top:1px solid #c6c6c6;
}
.addRule dl dt , .addRule dl dd{
	float:left;
	min-width:10em;
	height:1em;
	margin:0 !important;
	padding:0 !important;
	line-height:1.0;}
.addRule dl dt {
	clear:both;}
.addRule dl{
	  overflow: hidden;
	  margin-top:0 !important;}	
.addRule p{
	  margin-bottom:0 !important;}	

/* ================================================================================
/* 	販売運営ポリシー
/* ================================================================================ */
.rule_notes {
	margin: 10px 0 0;
}
.rule_notes li {
	position: relative;
	padding-left: 15px;
}
.rule_notes li:before {
	content: "\203b";

	position: absolute;
	top: 0;
	left: 0;
}



/* ================================================================================
/* 	ビジネスパートナー
/* ================================================================================ */

/* relation_box
/* -------------------------------------------------------------------------------- */
.body.paragraph > p + .relation_box {
	margin-top: 20px;
}
.relation_box .body.paragraph {
	padding: 20px;
}
.relation_box .body.paragraph .address {
	display: block;
	padding-bottom: 20px;

	font-size: 16px;
	font-weight: bold;
}
.relation_box .body.paragraph p + .disc_l {
	margin-top: 15px;
}
.relation_box .body.paragraph li {
	margin-top: 10px;
}




/* ================================================================================
/* 	ご利用ガイド
/* ================================================================================ */

/* wrapper
/* -------------------------------------------------------------------------------- */
.tog_contents .main .body .wrapper {
	min-height: 0;
}
.main .body .wrapper ~ .wrapper {
	padding-bottom: 10px;
}

/* banner_box
/* -------------------------------------------------------------------------------- */
.main .body .wrapper .banner_box {
	border-bottom: 0 none;
}

/* tab_box
/* -------------------------------------------------------------------------------- */
.tog_contents .main .tab_box {
	position: relative;
	padding-top: 50px;
	background: #e4e4e4;
}
.tog_contents .main .tab_box .category .head.category_head {
	position: absolute;
	top: 0;

	display: table;
	height: 50px;

	background: #e4e4e4;
}
.tog_contents .main .tab_box .category .head.category_head .label {
	float: none;

	color: #5b5b5b;
}
.tog_contents .main .tab_box .category .head.category_head .label {
	display: table-cell;

	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}
.tog_contents .main .tab_box .category .head.category_head .label:hover {
	background: #ececec;
	color: #8f8f8f;
}
.tog_contents .main .tab_box .category.st_current .head.category_head .label:hover {
	background: #d1d1d1;
}
.tog_contents .main .tab_box .category.st_current .head.category_head .label:hover span {
	color: #5d5d5d;
	border-bottom-color: #5d5d5d;
}

/* tab layout */
.tog_contents .main .tab_box .category .head.category_head {
	width: 50%;
	text-align: center;
}
.tog_contents .main .tab_box .category .head.category_head span {
	float: none;
	font-size: 14px;
}

.tog_contents .main .tab_box .category.game_start .head.category_head {
	left: 0;
	border-right: 1px solid #fff;
}
.tog_contents .main .tab_box .category.game_fun .head.category_head {
	left: 50%;
}
.tog_contents .main .tab_box .category.game_how .head.category_head {
	left: 430px;
}

/* current */
.tog_contents .main .tab_box .category.st_current .head.category_head .label {
	padding-top: 3px;

	color: #000;
	background: #c6c6c6;
	border-bottom: 3px solid #000;
	border-left: none;
}
.tog_contents .main .tab_box .category .body,
.tog_contents .main .tab_box .category .foot {
	display: none;
}
.tog_contents .main .tab_box .category.st_current .body,
.tog_contents .main .tab_box .category.st_current .foot {
	display: block;
	background: #fff;
}

/* base_box
/* -------------------------------------------------------------------------------- */

/* register_step
/* .................................................. */

.main .body .wrapper .base_box .register_step {
	margin-bottom: 50px;

	font-size: 14px;
}

/* step_contents
/* .................................................. */
.main .body .wrapper .base_box .register_step .step_contents {
	overflow: hidden;
	margin-top: 20px;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step,
.main .body .wrapper .base_box .register_step .step_contents .arrow_step {
	float: left;
}

/* flow_step */
.main .body .wrapper .base_box .register_step .step_contents .flow_step {
	width: 226px;
	height: 250px;
	padding-top: 25px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

	background: #77cccc;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step .flow_title {
	font-weight: bold;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step.step_first .flow_title {
	padding: 34px 0 10px;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step.step_second .flow_title {
	padding: 20px 0 16px;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step.step_third {
	background: #f67755;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step .figure {
	display: block;

	text-align: center;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step span[class^="flow_"] {
	display: block;

	text-align: center;
}
.main .body .wrapper .base_box .register_step .step_contents .flow_step .flow_start_title {
	display: block;
	padding-top: 38px;

	text-align: center;
	color: #fff;
	font-size: 28px;
	font-weight: bold;
}

/* arrow_step */
.main .body .wrapper .base_box .register_step .step_contents .arrow_step {
	position: relative;
	width: 80px;
	height: 250px;
	padding: 0;
}
.main .body .wrapper .base_box .register_step .step_contents .arrow_step .figure {
	position: absolute;
	top: 50%;
	left:50%;
	margin: -25px 0 0 -30px;
}
.main .body .wrapper .base_box .register_step .step_contents .arrow_step .true_word {
	display: block;
	padding-top: 74px;

	font-size: 14px;
	font-weight: bold;
	text-align: center;
}

/* acquisition_step
/* .................................................. */

/* arrow_step */
.main .body .wrapper .base_box .register_step .acquisition_step .arrow_step {
	position: relative;
	padding: 10px 0;
}
.main .body .wrapper .base_box .register_step .acquisition_step .arrow_step span.figure {
	padding-left: 88px;
}
.main .body .wrapper .base_box .register_step .acquisition_step .arrow_step span.false_word {
	position: absolute;
	top: 50%;
	left: 52px;
	margin-top: -7px;

	font-weight: bold;
}

/* flow_step */
.main .body .wrapper .base_box .register_step .acquisition_step .flow_step {
	display: inline-block;
	padding: 10px 18px 10px 15px;
	border: 5px solid #ccbb99;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

	color: #ccbb99;
}
.main .body .wrapper .base_box .register_step .acquisition_step .flow_step .figure {
	padding-right: 30px;
}
.main .body .wrapper .base_box .register_step .acquisition_step .flow_step .flow_description {
	display: inline-block;
	height: 55px;
	margin-bottom: 5px;
	padding: 22px;
	border-left: 2px solid #ccbb99;
}

/* supplement
/* -------------------------------------------------------------------------------- */
.main .body .game_start .wrapper {
	padding-bottom: 0;
}
.main .body .wrapper .supplement {
	overflow: hidden;
}
.main .body .wrapper .supplement .base_box {
	width: 404px;
}
.main .body .wrapper .supplement .supplement_left {
	float: left;
}
.main .body .wrapper .supplement .supplement_right {
	float: right;
}

/* supplement_left
/* .................................................. */

/* paragraph */
.main .body .wrapper .supplement .supplement_left .paragraph {
	padding: 15px 15px 20px;
}

/* button */
.main .body .wrapper .supplement .supplement_left .button {
	text-align: center;
}
.main .body .wrapper .supplement .supplement_left .button a {
	width: 315px;
}
/* supplement_right
/* .................................................. */

/* head */
.main .body .wrapper .supplement .supplement_right .box .head {
	padding: 10px;
	border-bottom: 1px dotted #666;

	font-size: 16px;
	font-weight: bold;
}

/* game_list */
.supplement_right .box .game_list a {
	width: 133px;

	text-align: center;
}
.supplement_right .box .game_list .figure {
	width: 80px;
	height: 80px;
	margin: 26px auto;
	overflow: hidden;
}
.supplement_right .box .game_list a .data {
	height: 40px;
}

.supplement_right .box .game_list a .data span {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
}
.supplement_right .box .game_list .item .figure img {
	margin: -6px 0 0 -6px;
}



/* ================================================================================
/* 	ご利用ガイド 2ページ目
/* ================================================================================ */

/* guide_info
/* -------------------------------------------------------------------------------- */
.main .guide_info {
	padding: 20px 0 16px;
}
.main .guide_info + .guide_info {
	padding: 20px 0;
	border-top: 1px solid #c6c6c6;
}
.main .guide_info.guide_gold {
	padding-bottom: 0;
}
.main .guide_info:after {
	content: "";
	display: block;
	clear: both;
}

/* figure
/* .................................................. */
.main .guide_info .figure {
	float: left;
}

/* guide_data
/* .................................................. */
.main .guide_info .guide_data {
	padding-left: 260px;
}
.main .guide_info .guide_data .title {
	padding-bottom: 11px;

	font-size: 14px;
	font-weight: bold;
}
.main .guide_info .guide_data .arrow_link {
	margin-top: 16px;
	padding-top: 15px;
	border-top: 1px dotted #666;
}
.main .guide_info .guide_data .arrow_link a {
	padding: 0 18px 0 30px;

	font-size: 11px;
	font-weight: bold;
}

/* gold_link */
.main .guide_data .gold_link {
	overflow: hidden;
	padding-top: 16px;
}
.main .guide_data .gold_link div[class^="gold_"] {
	width: 280px;
}
.main .guide_data .gold_exchange {
	float: left;
}
.main .guide_data .gold_purchase {
	float: right;
}
.main .guide_data div[class^="gold_"] div[class^="icn_"] {
	position: relative;
	display: table;
	padding: 5px 10px 5px 55px;
}
.main div[class^="icn_"] .item:before {
	position: absolute;
	top: -8px;
	left: 0;
	width: 40px;
	height: 40px;
	margin: auto;

	font-family: 'icons_tog';
	font-size: 40px;
	color: #8a8a8a;
}
.main .icn_change .item:before {
	content: "\e603";
}
.main .icn_golds .item:before {
	content: "\e60c";
}
.main div[class^="gold_"] div[class^="icn_"] span {
	display: table-cell;
	height: 38px;
	vertical-align: middle;
	line-height: 1.6;
}
.main .guide_data div[class^="gold_"] .arrow_link {
	margin-top: 15px;
}



/* ================================================================================
/* 	ご利用ガイド 3ページ目
/* ================================================================================ */

/* other_links
/* -------------------------------------------------------------------------------- */
.other_links ul {
	display: block;
	width: 839px;
	margin: 19px 0 0 -1px;
	overflow: hidden;
}
.other_links ul li {
	float: left;
	display: block;
	width: 33.33%;
	padding: 1px 0 0 1px;
}
.other_links ul li ~ li {
	margin-top: 0;
}
.other_links ul li a {
	display: block;
	padding: 15px;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	background: #e4e4e4;
}
.other_links ul li a:hover {
	opacity: 0.7;
}



/* ================================================================================
/* 	使い方ページ		.tog_contents.member_rile
/* ================================================================================ */

/* base_box
/* -------------------------------------------------------------------------------- */
/* list
/* .................................................. */
.tog_contents.member_rile .main .base_box .body .list {
	padding: 15px;
}
.tog_contents.member_rile .main .base_box .body .list li + li {
	border-top: 1px dotted #666;
}

.tog_contents.member_rile .main .base_box .body .list li a {
	display: block;
	padding: 15px 0;
	text-decoration: none;
}
.tog_contents.member_rile .main .base_box .body .list li a:hover {
	text-decoration: underline;
}



/* ================================================================================
/* 	年齢認証
/* ================================================================================ */

/* finish_box
/* -------------------------------------------------------------------------------- */
.hero .finish_box {
	text-align: center;
}

/* paragraph
/* .................................................. */
.hero .finish_box .paragraph {
	height: auto;
	margin-bottom: 0;
}
.hero .finish_box .paragraph .head {
	color: #d00;
}
.hero .finish_box .paragraph .verification {
	padding-top: 10px;

	font-size: 18px;
	font-weight: bold;
	color: #d00;
}
.hero .finish_box .inner .foot_navi_box {
	padding-top: 15px;
}

/* ================================================================================
/* gold_terms
/* ================================================================================ */
.main .base_box .body > dl {
	margin: 20px 0;
}
.main .base_box .body > dl dt,
.main .base_box .body > dl dd {
	padding: 0 20px 0 55px;
}
.main .base_box .body > dl dd + dt {
	margin-top: 10px;
}
.main .base_box .body > dl dt {
	position: relative;
}
.main .base_box .body > dl dt span {
	position: absolute;
	left: 20px;
}
.main .base_box .body > dl dd {
	margin-top: 5px;
	line-height: 1.3;
}