/*----------------------------------------------------------------------------------
Ctrl + F
	ヘッダー
	インフォウィンドウ
	履歴一覧
	カテゴリアイコン
	共通ページ移動ボタン

	本文
	リストの罫線
	くじコスチュームの一覧
	テーブル風レイアウト
	画像のフロート
----------------------------------------------------------------------------------*/


/*----------------------------------------------------------------------------------
	ヘッダー
----------------------------------------------------------------------------------*/
#header_title_01 {
	background: url(../img/info/header_title_01.png) no-repeat;
}
#header_title_02 {
	background: url(../img/info/header_title_02.png) no-repeat;
}


/*----------------------------------------------------------------------------------
	インフォウィンドウ
----------------------------------------------------------------------------------*/
.info #content [class*="frame_"] {
	padding: 0px;
}
object {
	width: 100%;
	height: 645px;
	margin-bottom: -5px;
	border-radius: 10px;
	overflow: hidden;
}
@media screen and (min-height: 253px) {
[class*="color_"] dl {
	height: 635px;
	overflow-x: hidden;
	overflow-y: scroll;
	overflow-scrolling: touch;
	-webkit-overflow-scrolling: touch;
}}

@media screen and (max-width: 320px) {
object {
	height: 300px;
}
[class*="color_"] dl {
	height: 290px;
}}

@media screen and (max-height: 252px) {
body {
	border: none;
	overflow: hidden;
}}

body.color_b,
body.color_p,
body.color_g,
body.color_v,
body.color_y {
	background: none;
}


/*----------------------------------------------------------------------------------
	履歴一覧
----------------------------------------------------------------------------------*/
[class*="color_"] dl {
	padding: 5px;
	font-size: 11pt;
	line-height: 140%;
}
[class*="color_"] dt {
	margin-top: 5px;
}
[class*="color_"] dt:first-of-type {
	margin-top: 0px;
}
[class*="color_"] dd {
	margin-top: 0px;
	margin-bottom: 4px;
	padding: 0px 0px 3px 0px;
	border-bottom: 1px solid;
	border-radius: 0px;
}

.color_b dd,
.color_y dd {
	border-color: #48cdff;
}
.color_p dd {
	border-color: #ff4aa3;
}
.color_g dd {
	border-color: #00d6ab;
}
.color_v dd {
	border-color: #be53ff;
}

@media screen and (max-width: 568px) {
[class*="color_"] dl {
	padding: 3px;
	font-size: 8pt;
}
[class*="color_"] dt {
	margin-top: 3px;
}
[class*="color_"] dd {
	margin-bottom: 4px;
	padding-bottom: 2px;
}}


/*----------------------------------------------------------------------------------
	カテゴリアイコン
----------------------------------------------------------------------------------*/
dt [class*="icon_"] {
	display: inline-block;
	width: 86px;
	padding: 1px 0px 0px 0px;
	color: #ffffff;
	letter-spacing: -1px;
	line-height: 1.2em;
	text-align: center;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
@media screen and (max-width: 545px) {
dt [class*="icon_"] {
	width: 62px;
}}

.icon_b {
	background: #48cdff;
}
.icon_p {
	background: #ff4aa3;
}
.icon_g {
	background: #00d6ab;
}
.icon_v {
	background: #be53ff;
}
.icon_y {
	color: #48cdff !important;
	background: #f6ff00;
}


/*----------------------------------------------------------------------------------
	共通ページ移動ボタン
----------------------------------------------------------------------------------*/
[class*="go_"]:first-of-type a {
	margin-right: 5px;
}


/*----------------------------------------------------------------------------------
	本文
----------------------------------------------------------------------------------*/
p {
	margin: 10px 0px;
}

dd img {
	margin: 10px auto;
}

@media screen and (max-width: 568px) {
p {
	margin: 8px 0px;
}
dd img {
	margin: 5px auto;
}}
dd img:nth-of-type(2) {
	margin-left: 10px;
}
dd .clearfix img {
	float: left;
	margin: 2px 5px 5px 0px;
}

.renew_border {
	border-bottom: double 5px;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
@media screen and (max-width: 568px) {
.renew_border {
	padding-bottom: 10px;
	margin-bottom: 10px;
}}
.frame_b .renew_border,
.frame_y .renew_border {
	border-color: #48cdff;
}
.frame_p .renew_border {
	border-color: #ff4aa3;
}
.frame_g .renew_border {
	border-color: #00d6ab;
}
.frame_v .renew_border {
	border-color: #d28aff;
}


/*----------------------------------------------------------------------------------
	リストの罫線
----------------------------------------------------------------------------------*/
[class^="frame_"] ul {
	padding: 5px;
	background: #ffffff;
	border-radius: 6px;
}

[class^="frame_"] li {
	margin-bottom: 5px;
	padding-bottom: 3px;
	border-bottom: 1px solid;
}
[class^="frame_"] li:last-of-type {
	margin-bottom: 0px;
	padding-bottom: 0px;
	border: none;
}
.frame_b li,
.frame_y li {
	border-color: #48cdff;
}
.frame_p li {
	border-color: #ff4aa3;
}
.frame_g li {
	border-color: #00d6ab;
}
.frame_v li {
	border-color: #be53ff;
}


/*----------------------------------------------------------------------------------
	くじコスチュームの一覧
----------------------------------------------------------------------------------*/
dl.list_genre {
	width: 100%;
	margin: 0px auto;
	padding: 0px 0px 3px 0px !important;
	text-align: center;
}

.list_genre dt {
	float: left;
	width: 240px;
	margin: 0px;
	padding: 2px 0px !important;
	border-radius: 6px;
	clear: both;
}
.list_genre dd + dt {
	color: #000000;
	background: #cbfff4;
}

.list_genre dd {
	float: left;
	width: 238px;
	margin: 0px 0px 2px 2px !important;
	padding: 2px 0px !important;
	font-weight: normal !important;
	background: #cbfff4;
	border-radius: 6px;
}

.list_genre .genre,
.list_genre .boy,
.list_genre .girl {
	color: #ffffff;
	font-weight: bold !important;
}
.list_genre .genre {
	margin-top: 0px;
	background: #00d6ab;
}
.list_genre .boy {
	background: #48cdff;
}
.list_genre .girl {
	background: #ff4aa3;
}

.list_genre dt + dd {
	background: #defcff;
}
.list_genre dt + dd + dd {
	background: #ffe1f6;
}

@media screen and (max-width: 640px) {
dl.list_genre {
	width: 100%;
	padding-bottom: 0px !important;
}
.list_genre dt {
	float: none;
	width: 100%;
	margin-bottom: 2px;
}
.list_genre dd + dt {
	margin-top: 28px !important;
}
.list_genre dd {
	float: left;
	width: 49.8%;
	margin-left: 0px !important;
}
.list_genre dd + dd {
	float: right;
}
.list_genre dd.list_genre_col {
	margin-bottom: 4px !important;
	line-height: 218%;
}
.list_genre dd.list_genre_col + dd {
	line-height: 112%;
}}


/*----------------------------------------------------------------------------------
	テーブル風レイアウト
----------------------------------------------------------------------------------*/
[class^="dl_"] {
	width: 99%;
	margin: 0px auto;
}
[class^="dl_"] dt {
	margin: 2px auto !important;
	padding-left: 3px;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px;
}
[class^="dl_"] dt + dd {
	margin: 0px auto 6px auto !important;
	padding: 3px 3px 2px 3px;
	border-radius: 5px;
}

.dl_b dt {
	background: #48cdff;
}
.dl_b dt + dd {
	background: #defcff;
}

.dl_p dt {
	background: #ff4aa3;
}
.dl_p dt + dd {
	background: #ffe1f6;
}

.dl_g dt {
	background: #00d6ab;
}
.dl_g dt + dd {
	background: #cbfff4;
}

.dl_v dt {
	background: #be53ff;
}
.dl_v dt + dd {
	background: #f3dfff;
}


/*----------------------------------------------------------------------------------
	画像のフロート
----------------------------------------------------------------------------------*/
.img_float {
/*	width: 100%;*/
}
.img_float .clearfix {
	width: 33%;
}
.img_float .clearfix div:nth-of-type(odd) {
	padding: 5px;
}
.img_float img {
	float: none !important;
	margin: 0px !important;
}
.img_float .clearfix div:nth-of-type(even) {
	display: inline-block;
	margin-left: -12px;
	font-size: 11pt;
}

@media screen and (max-width: 640px) {
.img_float {
	width: 80%;
}
.img_float .clearfix {
	display: block;
	float: none;
	clear: both;
	width: 100%;
}
.img_float .clearfix div {
	float: left;
}
.img_float .clearfix div:nth-of-type(odd) {
	width: 30%;
	padding: 3px 5px;
}
.img_float .clearfix div:nth-of-type(even) {
	margin-left: -6px;
	padding-top: 5px;
	font-size: 10pt;
	text-align: left;
}}