@charset "utf-8";

/* ------------------------- TOC 
01 Setup
02 CSS Hack
03 wrap around the contents (base layout box)
04 site (global) navigation
05 contents
06 footer
07 others
 ------------------------- */

/* ============================== 01 Setup */
* { margin: 0; padding: 0; text-decoration: none; text-align: left; border: none; font-weight: normal; color: #022666; font-family: "Lucida Grande", "Hiragino Kaku Gothic Pro", "MS PGothic", Osaka, sans-serif; font-size: small; font-style: normal; }
body { margin:10px; color:#022666; text-align: center; }
ul, ol, dl, li, dt, dd { list-style: none; }
a { text-decoration: none; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover, a:active { text-decoration: none; }
a img, a:link img, a:visited img, a:hover img, a:active img { border: none; text-decoration: none; }
table { border-collapse: collapse; }
input { vertical-align: bottom; }

/* ============================== 02 CSS Hack */
/* floating box clear */
.clr:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clr { display: inline-table; min-height: 1%; }
/* Hide from mac IE5*/
* html .clr { height: 1%; }
.clr { display: block; }
/* End Hide from mac IE5 */

/* hide text */
.hidetxt { text-indent: -9999px; overflow: hidden; }
.hidetxt a { text-decoration: none; }


/* ============================== 03 wrap around the contents (base layout box) */

/* 共通 */
.vf #container_out { text-align:center; width:100%; }
.vf #container_in { margin: 0 auto; width:800px; }
.vf { line-height: 1.4em; _line-height: 1.3em; }
.vf .spacing { padding-bottom: 1em; }
strong { font-weight: bold; }
.small { font-size: x-small; }

.vf #contents a { text-decoration: none; }
.vf #contents p a:link,
.vf #contents dd a:link { color: #6384c0; border-bottom: #6384c0 solid 1px; }
.vf #contents p a:visited,
.vf #contents dd a:visited { color: #6384c0; border-bottom: #6384c0 solid 1px; }
.vf #contents p a:hover,
.vf #contents dd a:hover,
.vf #contents p a:active,
.vf #contents dd a:active { color: #335ca4; border-bottom: #335ca4 solid 1px; }
.vf a img, .wonder a:link img, .vf a:visited img, .vf a:hover img, .vf a:active img { border: none; text-decoration: none; }

/* トップページ */
#wonder_idx h1 { background: url(../special/wonder_world_vf/main.jpg) no-repeat left top; height: 260px; padding-left:270px; position:relative; z-index: 1; }
#wonder_idx h1 img { position:relative; z-index: 1; }
#wonder_idx #topbanner { position:relative; top: 177px; left: 623px; z-index: 2; height: 0; _top: 242px; _margin-top:-65px; padding:0; width: 160px; }
.wonder #contents { background: url(../special/wonder_world_vf/bg_frame.gif) repeat-y left top; padding: 15px 17px; margin: 0; }

.wonder #contents .leftcol { width:400px; float:left; }
.wonder #contents .rightcol { width:315px; float:right; }

.wonder #contents #event01 h2,
.wonder #contents #event02 h2 { margin-bottom:5px; }

/*.jp #contents #event01 { border-right:1px solid #065c31; padding-right:20px; padding-left:5px; padding-bottom:12px; }*/
/*.en #contents #event01 { padding-left:5px; }*/
/*.en #contents #event02 { border-left:1px solid #065c31; padding-left:20px; padding-right:5px; padding-bottom:12px; }*/
.wonder #contents #event01 { padding-left:5px; }
.wonder #contents #event02 { border-left:1px solid #065c31; padding-left:20px; padding-right:5px; padding-bottom:12px; }
.jp #contents #event03 { border-right:1px solid #065c31; padding-right:20px; padding-left:5px; padding-bottom:12px; }
.jp #contents #event04 { padding-left:20px; padding-right:5px; padding-bottom:12px; }
.en #contents #event03 { padding-right:20px; padding-left:5px; padding-bottom:12px; }
.en #contents #event04 { border-left:1px solid #065c31; padding-left:20px; padding-right:5px; padding-bottom:12px; }

.wonder #contents #event01 #text01_01 { width:400px; }
.wonder #contents #event01 #text01_02 { width:400px; margin-bottom: 1em; }
.wonder #contents #event01 #text01_01 img { float:left; }
.wonder #contents #event01 #text01_01 p { float:right; width:225px; }
.wonder #contents #event01 #text01_02 .image { float:right; }
.wonder #contents #event01 #text01_02 p { float:left; width:270px; }
.wonder #contents #event01 p {}

.jp #contents #event01 .button_area { margin-top:5px; float:left; width: 210px; }
.jp #contents #event01 .button_area a,
.jp #contents #event01 .button_area a:link,
.jp #contents #event01 .button_area a:visited
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../jpn/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.en #contents #event01 .button_area { margin-top:5px; float:left; width: 239px; }
.en #contents #event01 .button_area a,
.en #contents #event01 .button_area a:link,
.en #contents #event01 .button_area a:visited
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../eng/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.wonder #contents #event01 .button_area a:hover,
.wonder #contents #event01 .button_area a:active { background-position: 0 -18px; }

.wonder #contents #event02 .image { float:right; margin-left:5px; width:132px; }
.wonder #contents #event02 .image img { margin-right:1px; }
.wonder #contents #event02 p { margin-bottom: 1em; }

.jp #contents #event03 .button_area { margin-top:12px; width: 145px; margin-bottom: 15px; }
.jp #contents #event03 .button_area a,
.jp #contents #event03 .button_area a:link,
.jp #contents #event03 .button_area a:visited
{ display: block; background-position: 0 -36px; background-repeat: no-repeat; background-image: url(../../jpn/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.en #contents #event03 .button_area { margin-top:12px; width: 126px; margin-bottom: 15px; }
.en #contents #event03 .button_area a,
.en #contents #event03 .button_area a:link,
.en #contents #event03 .button_area a:visited
{ display: block; background-position: 0 -36px; background-repeat: no-repeat; background-image: url(../../eng/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.wonder #contents #event03 .button_area a:hover,
.wonder #contents #event03 .button_area a:active { background-position: 0 -54px; }

.jp #contents #event04 .button_area { margin-top:12px; float:left; width: 132px; }
.jp #contents #event04 .button_area a,
.jp #contents #event04 .button_area a:link,
.jp #contents #event04 .button_area a:visited
{ display: block; background-position: 0 -72px; background-repeat: no-repeat; background-image: url(../../jpn/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.en #contents #event04 .button_area { margin-top:12px; float:left; width: 171px; }
.en #contents #event04 .button_area a,
.en #contents #event04 .button_area a:link,
.en #contents #event04 .button_area a:visited
{ display: block; background-position: 0 -72px; background-repeat: no-repeat; background-image: url(../../eng/special/wonder_world_vf/img/btn.gif); height: 18px; border-bottom: 0; }
.wonder #contents #event04 .button_area a:hover,
.wonder #contents #event04 .button_area a:active { background-position: 0 -90px; }

.wonder #contents #event02 .banner dt { float:left; }
.wonder #contents #event02 .banner dd { float:right; width:145px; padding-top:12px; }
.wonder #contents #event02 .banner dd a { font-size:x-small; }

.wonder #contents #event02 .banner_02 dt { float:left; }
.wonder #contents #event02 .banner_02 dd { float:right; width:235px; font-size:x-small; }
.wonder #contents #event02 .banner_02 dd a { font-size:x-small; }

.wonder #contents #event03 .team dt { float:left; }
.wonder #contents #event03 .team dd { float:right; width:310px; }
.wonder #contents #event03 .team_02 dt { float:left; }
.wonder #contents #event03 .team_02 dd { float:right; width:285px; margin-bottom: 1.5em; }

.wonder #contents #event03 h2,
.wonder #contents #event04 h2 { padding-top:10px; margin-bottom:5px; }

.wonder #contents #event03 .image img { float:left; margin-right:10px; }

.wonder #contents #event03 .banner dt { float:left; }
.wonder #contents #event03 .banner dd { float:right; width:230px; padding-top:12px; }
.wonder #contents #event03 .banner dd a { font-size:x-small; }

.wonder #contents #event04 .image img { float:right; margin-left:10px; }
.wonder #contents #event04 .image p { float:left; width:145px; }
.wonder #contents #event04 .image_02 img { float:left; margin-right:10px; }
.wonder #contents #event04 .image_02 p { float:right; width:175px; }

.wonder #contents #event04 .banner { margin-bottom: 1.5em; }
.wonder #contents #event04 .banner dt { float:left; }
.wonder #contents #event04 .banner dd { float:right; width:235px; font-size:x-small; }
.wonder #contents #event04 .banner dd a { font-size:x-small; }

.wonder #event05 { background: url(../special/wonder_world_vf/bg_frame.gif) repeat-y left top; padding-bottom: 4px; margin: 0; }
/*.wonder #info { margin: 0 7px; border-top:5px solid #065c31; padding-top:12px; width:786px; }*/
.wonder #info { border-top:5px solid #065c31; padding-top:12px; width: 800px; }
/*.wonder #info p { font-size:x-small; color:#065c31; margin-left:15px; width:765px; }*/
.wonder #info p { font-size:x-small; color:#065c31; margin-left: 22px; width:765px; }

/* フッタ */
#footer { line-height: 1em; width: 800px; margin-top: 5px; }
#footer .credit { font-size:x-small; text-align: center; color: #065c31; }

#footer .button_area { margin: 0 0 0 749px; width: 46px; }
#footer .button_area a, #footer .button_area a:link, #footer .button_area a:visited
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../special/wonder_world_vf/btn_close.gif); height: 12px; border-bottom: 0; line-height: 1%; text-indent: -9999px; font-size: 1; }
#footer .button_area a:hover, #footer .button_area a:active { background-position: 0 -12px; }

/* 第2階層*/
.wonder_2nd h1 { background: url(../special/wonder_world_vf/main_2nd.jpg) no-repeat left top; height: 75px; padding-left:120px; }
.wonder_2nd #contents { background: url(../special/wonder_world_vf/bg_frame.gif) repeat-y left top; padding: 25px 22px 0 22px; margin: 0; }
.wonder_2nd #lead { width: 756px; margin-bottom: 20px; }
.wonder_2nd #contents .leftcol { width:368px; float:left; }
.wonder_2nd #contents .rightcol { width:368px; float:right; }
#wonder_list #contents .set { width:368px; padding: 15px 0; border-top: 1px dotted #065c31; }
#wonder_list #contents .set .imgcol { width: 130px; float: right; margi-left: 10px; }
.wonder_2nd h2 { color: #065c31; font-weight: bold; margin-bottom: 3px; }
#wonder_list #contents .set li { list-style-type: disc; margin-left: 17px; }
.wonder_2nd #back { background: url(../special/wonder_world_vf/bg_frame.gif) repeat-y left top; padding: 5px 17px 0 17px; margin: 0; }
.wonder_2nd #back p { width: 766px; border-top: 1px solid #065c31; padding-top:10px; }
.wonder_2nd #back p a,
.wonder_2nd #back p a:link,
.wonder_2nd #back p a:visited
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../special/wonder_world_vf/btn_backtotop.gif); height: 13px; border-bottom: 0; margin-left: 680px; }
.wonder_2nd  #back p a:hover,
.wonder_2nd  #back p a:active { background-position: 0 -13px; }

#wonder_list ul { margin-bottom: 1em; }

#wonder_goods #contents .photoright,
#wonder_goods #contents .photoright02,
#wonder_goods #contents .photoleft,
#wonder_goods #contents .photoleft169 { padding: 15px 0; border-top: 1px dotted #065c31; }
#wonder_goods #contents .photoleft_first { padding-bottom: 15px; }
#wonder_goods #contents .photoright .txtcol { width: 478px; float: left; }
#wonder_goods #contents .photoright .imgcol { width: 268px; float: right; }
#wonder_goods #contents .photoright02 .imgcol { width: 268px; float: right; margin-left: 10px; }
#wonder_goods #contents .photoleft .txtcol,
#wonder_goods #contents .photoleft_first .txtcol { width: 408px; float: right; }
#wonder_goods #contents .photoleft .imgcol,
#wonder_goods #contents .photoleft_first .imgcol { width: 338px; float: left; }
#wonder_goods #contents .photoleft169 .txtcol { width: 577px; float: right; }
#wonder_goods #contents .photoleft169 .imgcol { width: 169px; float: left; }
#wonder_goods #contents h3 { font-weight: bold; margin-bottom: 2px; }
#wonder_goods #contents .cap { color:#065c31; font-size: x-small; }
#wonder_goods #contents #sub_nav p { width: 756px; text-align: right; padding-bottom: 5px; }

#wonder_int #contents .photoright,
#wonder_int #contents .photoleft { padding: 15px 0; border-top: 1px dotted #065c31; }
#wonder_int #contents .photoright .imgcol { width: 190px; float: right; margin-left: 10px; margin-bottom: 5px; }
#wonder_int #contents .photoleft .imgcol { width: 190px; float: left; margin-right: 10px; margin-bottom: 5px; }
#wonder_int #contents h3 { font-weight: bold; margin-bottom: 2px; }
#wonder_int #contents h4 { color:#065c31; margin-bottom: 2px; }