@charset "UTF-8"; @import "reset.css"; body { font-family: 'Kozuka Gothic Pro','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3',"メイリオ","ＭＳ Ｐゴシック"; line-height:1; } /* !font-size */ body { font-size:12px;} *:first-child+html body { font-size:77%;} * html body { font-size:77%;} .txt10 { font-size:83%;} .txt11 { font-size:92%;} .txt14 { font-size:117%;} .txt16 { font-size:133%;} .txt18 { font-size:149%;} /* !clearfix */ .cfix:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } .cfix{ overflow:hidden; } * html .cfix{ height:1%; overflow:visible; } .clear { clear:both;} /* !IE6 PNG FIX */ * html .pfix, * html .iconList li, * html .iconList li .icon img, * html .iconList li .icon, * html .iconArea .icon img { behavior: url(common/styles/iepngfix.htc); } /* !Links */ a:link { color:#0099cc; text-decoration:none; } a:visited { color:#0099cc; text-decoration:none; } a:hover { color:#fff; text-decoration:none; } a:active { color:#fff; text-decoration:none; } /* Common class */ body { background:#d90016; } .transparent { background: url(../images/transparent40.png); padding:10px 12px; } * html .transparent { background: #82000d; padding:10px 12px; } .wrapper { width:980px; margin:0 auto; } #container { background: url(../images/main_img_bg.gif) no-repeat top left; padding:22px 0 0 0; } #header { position:relative; } #language { position:absolute; top: 0; right:0; width:151px; } #language li { float:right; } #download { padding:10px 20px 15px; margin:0 0 9px 0; background: url(../images/transparent60.png); } * html #download { background:#570009; } #backnumber #download { margin: 0 0 20px 0; } #download .title { color:#fff; padding:0 0 12px 0;} #download .title h3 { float:left; padding:0 11px 0 0; } #download .title p { float:left; margin:6px 0 0 0;} #download .title p span { color:#fe0000; font-weight: bold; font-size:92%; padding:0 0 0 50px; } #download .arrow { float:right!important;} #download .arrow a { float:right; background: url(../images/arrow_dot.gif) no-repeat 0 5px; padding:0 0 0 10px; display:block; line-height:1.3; } #download .arrow back a { float:right; background: url(../images/arrow_dot_back.gif) no-repeat 0 5px; padding:0 0 0 10px; display:block; line-height:1.3; } #download .arrow a:link { color:#fff; text-decoration:none; } #download .arrow a:visited { color:#fff; text-decoration:none; } #download .arrow a:hover { color:#fff; text-decoration: underline; } #download .arrow a:active { color:#fff; text-decoration:underline; } #download .iconList { height: 1%;} #download .iconList li { float:left; background: url(../images/icon_base_bg.png); width:89px; height:110px; margin:0 5px 5px 0; text-align:center; padding: 10px 0 0 0; } #download .iconList li .icon { width: 63px; height: 85px; background-position: bottom left; margin: 0 13px -12px; } #download .iconList li .icon.ref001 { background: url(../images/ref001.png) no-repeat bottom left; } #download .iconList li .icon.ref002 { background: url(../images/ref002.png) no-repeat bottom left; } #download .iconList li .icon.ref003 { background: url(../images/ref003.png) no-repeat bottom left; } #download .iconList li .icon.ref004 { background: url(../images/ref004.png) no-repeat bottom left; } #download .iconList li .icon.ref005 { background: url(../images/ref005.png) no-repeat bottom left; } #download .iconList li .icon.ref006 { background: url(../images/ref006.png) no-repeat bottom left; } #download .iconList li .icon.ref007 { background: url(../images/ref007.png) no-repeat bottom left; } #download .iconList li .icon.ref008 { background: url(../images/ref008.png) no-repeat bottom left; } #download .iconList li .icon.ref009 { background: url(../images/ref009.png) no-repeat bottom left; } #download .iconList li .icon.ref010 { background: url(../images/ref010.png) no-repeat bottom left; } #download .iconList li .icon.ref011 { background: url(../images/ref011.png) no-repeat bottom left; } #download .iconList li .icon.ref012 { background: url(../images/ref012.png) no-repeat bottom left; } #download .iconList li .icon.ref013 { background: url(../images/ref013.png) no-repeat bottom left; } #download .iconList li .icon.ref014 { background: url(../images/ref014.png) no-repeat bottom left; } #download .iconList li .icon.ref015 { background: url(../images/ref015.png) no-repeat bottom left; } #download .iconList li .icon.ref016 { background: url(../images/ref016.png) no-repeat bottom left; } #download .iconList li .icon.ref017 { background: url(../images/ref017.png) no-repeat bottom left; } #download .iconList li .icon.ref018 { background: url(../images/ref018.png) no-repeat bottom left; } #download .iconList li .icon.ref019 { background: url(../images/ref019.png) no-repeat bottom left; } #download .iconList li .icon.ref020 { background: url(../images/ref020.png) no-repeat bottom left; } #download .iconList li .icon.ref021 { background: url(../images/ref021.png) no-repeat bottom left; } #download .iconList li .icon.ref022 { background: url(../images/ref022.png) no-repeat bottom left; } #download .iconList li .icon.ref023 { background: url(../images/ref023.png) no-repeat bottom left; } #download .iconList li .icon.ref024 { background: url(../images/ref024.png) no-repeat bottom left; } #download .iconList li .icon.ref025 { background: url(../images/ref025.png) no-repeat bottom left; } #download .iconList li .icon.ref026 { background: url(../images/ref026.png) no-repeat bottom left; } #download .iconList li .icon.ref027 { background: url(../images/ref027.png) no-repeat bottom left; } #download .iconList li .icon.ref028 { background: url(../images/ref028.png) no-repeat bottom left; } #download .iconList li .icon.ref029 { background: url(../images/ref029.png) no-repeat bottom left; } #download .iconList li .icon.ref030 { background: url(../images/ref030.png) no-repeat bottom left; } #download .iconList li .icon.ref031 { background: url(../images/ref031.png) no-repeat bottom left; } #download .iconList li .icon.ref032 { background: url(../images/ref032.png) no-repeat bottom left; } #download .iconList li .icon.ref033 { background: url(../images/ref033.png) no-repeat bottom left; } #download .iconList li .icon.ref034 { background: url(../images/ref034.png) no-repeat bottom left; } #download .iconList li .icon.ref035 { background: url(../images/ref035.png) no-repeat bottom left; } #download .iconList li .icon.ref036 { background: url(../images/ref036.png) no-repeat bottom left; } #download .iconList li .icon.ref037 { background: url(../images/ref037.png) no-repeat bottom left; } #download .iconList li .icon.ref038 { background: url(../images/ref038.png) no-repeat bottom left; } #download .iconList li .icon.ref039 { background: url(../images/ref039.png) no-repeat bottom left; } #download .iconList li .icon.ref040 { background: url(../images/ref040.png) no-repeat bottom left; } #download .iconList li .icon.ref041 { background: url(../images/ref041.png) no-repeat bottom left; } #download .iconList li .icon.ref042 { background: url(../images/ref042.png) no-repeat bottom left; } #download .iconList li .icon.ref043 { background: url(../images/ref043.png) no-repeat bottom left; } #download .iconList li .icon.ref044 { background: url(../images/ref044.png) no-repeat bottom left; } #download .iconList li .icon.ref045 { background: url(../images/ref045.png) no-repeat bottom left; } #download .iconList li .icon.ref046 { background: url(../images/ref046.png) no-repeat bottom left; } #download .iconList li .icon.ref047 { background: url(../images/ref047.png) no-repeat bottom left; } #download .iconList li .icon.ref048 { background: url(../images/ref048.png) no-repeat bottom left; } #download .iconList li .icon.ref049 { background: url(../images/ref049.png) no-repeat bottom left; } #download .iconList li .icon.ref050 { background: url(../images/ref050.png) no-repeat bottom left; } #download .iconList li .icon.ref051 { background: url(../images/ref051.png) no-repeat bottom left; } #download .iconList li .icon.ref052 { background: url(../images/ref052.png) no-repeat bottom left; } #download .iconList li .icon.ref053 { background: url(../images/ref053.png) no-repeat bottom left; } #download .iconList li .icon.ref054 { background: url(../images/ref054.png) no-repeat bottom left; } #download .iconList li .icon.ref055 { background: url(../images/ref055.png) no-repeat bottom left; } #download .iconList li .icon.ref056 { background: url(../images/ref056.png) no-repeat bottom left; } #download .iconList li .icon.ref057 { background: url(../images/ref057.png) no-repeat bottom left; } #download .iconList li .icon.ref058 { background: url(../images/ref058.png) no-repeat bottom left; } #download .iconList li .icon.ref059 { background: url(../images/ref059.png) no-repeat bottom left; } #download .iconList li .icon.ref060 { background: url(../images/ref060.png) no-repeat bottom left; } #download .iconList li .icon.ref061 { background: url(../images/ref061.png) no-repeat bottom left; } #download .iconList li .icon.ref062 { background: url(../images/ref062.png) no-repeat bottom left; } #download .iconList li .icon.ref063 { background: url(../images/ref063.png) no-repeat bottom left; } #download .iconList li .icon.ref064 { background: url(../images/ref064.png) no-repeat bottom left; } #download .iconList li .icon.ref065 { background: url(../images/ref065.png) no-repeat bottom left; } #download .iconList li .icon.ref066 { background: url(../images/ref066.png) no-repeat bottom left; } #download .iconList li .icon.ref067 { background: url(../images/ref067.png) no-repeat bottom left; } #download .iconList li .icon.ref068 { background: url(../images/ref068.png) no-repeat bottom left; } #download .iconList li .icon.ref069 { background: url(../images/ref069.png) no-repeat bottom left; } #download .iconList li .icon.ref070 { background: url(../images/ref070.png) no-repeat bottom left; } #download .iconList li .icon.ref071 { background: url(../images/ref071.png) no-repeat bottom left; } #download .iconList li .icon.ref072 { background: url(../images/ref072.png) no-repeat bottom left; } #download .iconList li .icon.ref073 { background: url(../images/ref073.png) no-repeat bottom left; } #download .iconList li .icon.ref074 { background: url(../images/ref074.png) no-repeat bottom left; } #download .iconList li .icon.ref075 { background: url(../images/ref075.png) no-repeat bottom left; } #download .iconList li .icon.ref076 { background: url(../images/ref076.png) no-repeat bottom left; } #download .iconList li .icon.ref077 { background: url(../images/ref077.png) no-repeat bottom left; } #download .iconList li .icon.ref078 { background: url(../images/ref078.png) no-repeat bottom left; } #download .iconList li .icon.ref079 { background: url(../images/ref079.png) no-repeat bottom left; } #download .iconList li .icon.ref080 { background: url(../images/ref080.png) no-repeat bottom left; } #download .iconList li .icon.ref081 { background: url(../images/ref081.png) no-repeat bottom left; } #download .iconList li .icon.ref082 { background: url(../images/ref082.png) no-repeat bottom left; } #download .iconList li .icon.ref083 { background: url(../images/ref083.png) no-repeat bottom left; } #download .iconList li .icon.ref084 { background: url(../images/ref084.png) no-repeat bottom left; } #download .iconList li .icon.ref085 { background: url(../images/ref085.png) no-repeat bottom left; } #download .iconList li .icon.ref086 { background: url(../images/ref086.png) no-repeat bottom left; } #download .iconList li .icon.ref087 { background: url(../images/ref087.png) no-repeat bottom left; } #download .iconList li .icon.ref088 { background: url(../images/ref088.png) no-repeat bottom left; } #download .iconList li .icon.ref089 { background: url(../images/ref089.png) no-repeat bottom left; } #download .iconList li .icon.ref090 { background: url(../images/ref090.png) no-repeat bottom left; } #download .iconList li .icon.ref091 { background: url(../images/ref091.png) no-repeat bottom left; } #download .iconList li .icon.ref092 { background: url(../images/ref092.png) no-repeat bottom left; } #download .iconList li .icon.ref093 { background: url(../images/ref093.png) no-repeat bottom left; } #download .iconList li .icon.ref094 { background: url(../images/ref094.png) no-repeat bottom left; } #download .iconList li .icon.ref095 { background: url(../images/ref095.png) no-repeat bottom left; } #download .iconList li .icon.ref096 { background: url(../images/ref096.png) no-repeat bottom left; } #download .iconList li .icon.ref097 { background: url(../images/ref097.png) no-repeat bottom left; } #download .iconList li .icon.ref098 { background: url(../images/ref098.png) no-repeat bottom left; } #download .iconList li .icon.ref099 { background: url(../images/ref099.png) no-repeat bottom left; } #download .iconList li .icon.ref100 { background: url(../images/ref100.png) no-repeat bottom left; } #download .iconList li h4 { color:#fff; font-weight:bold;} #download .iconList li .goStore { padding:2px 10px 0 8px;} #download .iconList .goStore a { font-size:83%; background:url(../images/arrow_blue.gif) no-repeat 0 4px; text-align:right; display:block; line-height:1.5;} #download .iconList .goStore a:link { color:#03b7d7; text-decoration:none; } #download .iconList .goStore a:visited { color:#03b7d7; text-decoration:none; } #download .iconList .goStore a:hover { color:#03b7d7; text-decoration: underline; } #download .iconList .goStore a:active { color:#03b7d7; text-decoration:underline; } #news { width:568px; height:253px; float:left; margin:0 0 9px 0; } #news dl { margin:20px 5px 20px 13px; line-height:1.2; height:200px; overflow:auto; } #news dt { color: #ecf40b; font-weight:bold; margin:0 0 2px 0; } #news dd { color:#fff; border-bottom: dashed 1px #fff; padding:0 0 5px 0; margin:0 10px 5px 0;} #news dd span { font-weight:bold; } #gallery { width:354px; height:253px; float:right; margin:0 0 9px 0; } #gallery div { padding: 17px 8px 13px; } #release { margin:0 0 9px 0;} #release #tabWrap { padding: 18px 13px;} #release .relTab { widows:199px; float:left; height: 350px; background: #8a8784;} #release .relTab li { position: relative; text-shadow: 1px 1px 2px #222; } #release .relTab li img { position: absolute; top:3px; left: 45px; } #release .relTab li a { background:url(../images/tab_bg.gif) no-repeat 0 0; width:199px; height:24px; display:block; text-align:center; font-size:117%; font-weight:bold; padding: 11px 0 0 0; color: #fff; } #release .relTab.child li a { background:url(../images/tab_bg2.gif) no-repeat;font-size: 12px; text-align: left;height:23px; padding: 12px 0 0 80px; width: 119px; } #release .relTab li a:link { background-position:0px -35px; } #release .relTab li a:visited { background-position:0px -35px; } #release .relTab li a:hover { background-position:0px 0px; } #release .relTab li a:active { background-position:0px 0px; } #release .relTab li.ui-tabs-selected a { background-position:0 0px; } #release .info { width:532px; float:right;} #release .info .pipe { position:relative;} #release .info .pipe img { position: absolute;} #release .info .line001 img { top:0px; left:0px;} #release .info .line002 img { top:35px; left:0px;} #release .info .line003 img { top:70px; left:0px;} #release .info .line004 img { top:105px; left:0px;} #release .info .line005 img { top:140px; left:0px;} #release .info .line006 img { top:175px; left:0px;} #release .info .line007 img { top:210px; left:0px;} #release .info .line008 img { top:245px; left:0px;} #release .info .line009 img { top:280px; left:0px;} #release .info .line010 img { top:315px; left:0px;} #release .info .base { background:#b36a66; border-top:solid 1px #df9896; border-bottom:solid 1px #5f1a19; border-right:solid 1px #5f1a19; padding:12px; margin:0 0 0 26px; height:324px; } #release .info .base .inner { background:#fff; height: 324px; padding:0 10px 0 0; } #release .info .base .card { background:url(../images/card_ref.gif) no-repeat bottom left; padding:0 0 47px 0; width:178px; margin:14px 0 0 54px; float:left; display: inline; } #release .info .text { width:190px; float:right; color:#575450; margin: 7px 0 0 0;} #release .info .text .iconArea { border-bottom:solid 1px #cac8c6; padding:0 0 0 70px; position: relative; line-height:1.2;} #release .info .text .iconArea .icon { position:absolute; top:0; left:-3px; } * html #release .info .text .iconArea .icon { position:absolute; top:0; left:-73px; } #release .info .text .iconArea h4 { font-weight: bold; padding:8px 0 4px 0; font-size: 117%;} #release .info .text p { margin:0 0 10px 0;} #release .info .text .explain { border-top: solid 1px #f1f0ef; padding: 18px 2px 0; line-height: 1.2; } #blogParts { margin:0 0 20px 0; padding:36px 25px; } #footer { background:#0053a7; padding:20px 0 0 0; line-height: 1.5; } #footer .roundBox { background:#fff; padding: 6px 10px; margin: 0 0 10px 0;} #footer h4 { color: #d90016; font-weight: bold; } #footer .cfix { background: url(../images/ftr_bg_line.gif);} #footer .ftrBox { font-size: 11px; float: left; padding: 0 10px;} #footer #ftr01 { width: 218px;} #footer #ftr01 li { background:url(../images/arrow_red.gif) no-repeat 0px 10px; padding:4px 0 4px 10px; } #footer #ftr02 { width: 312px;} #footer #ftr03 { width: 197px;} #footer #ftr03 li { padding: 4px 0 4px 10px; display: block; text-align: center; } #footer #ftr04 { width: 147px;} #footer #ftr04 p { padding: 0 0 0 35px; } #footer a:link { color:#000; text-decoration:underline; } #footer a:visited { color:#000; text-decoration:underline; } #footer a:hover { color:#666; text-decoration:underline; } #footer a:active { color:#666; text-decoration:underline; } #footer #thanks { font-size: 9px; color: #fff; padding: 0 20px; line-height: 1.5; margin: 0 0 30px 0; text-align:center;} #footer #thanks strong { font-weight: bold;} #footer #apple { color: #fff; font-size: 10px; text-align: center; border-bottom: 1px solid #3d7cbc; padding: 0 0 8px 0;} #footer #copyright { color: #fff; font-size: 9px; text-align: center; padding: 5px 0 30px 0;} .hidden { display: none; } #pop { width: 242px; background:#0053a7; padding:24px 17px 20px; text-align:center; } #pop h3 { margin:0 -17px 14px; } #pop .popImage { border: solid 1px #d9e5f2; padding: 2px; background:#fff; width:160px; margin:0 auto 16px; } #pop textarea { border: solid 1px #a2b6cd; width:240px; height:64px; margin: 0; font-size:12px; max-width: 240px; max-height: 64px; } /* Caution! Ensure accessibility in print and other media types... */ @media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */ .ui-tabs-hide { display: none; } } /* Hide useless elements in print layouts... */ @media print { .ui-tabs-nav { display: none; } } /* Skin */ .ui-tabs-nav, .ui-tabs-panel { } .ui-tabs-nav { } .ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */ } .ui-tabs-nav li { } *:first-child+html .ui-tabs-nav li, * html .ui-tabs-nav li { font-family:"ＭＳ Ｐゴシック";} .ui-tabs-nav a, .ui-tabs-nav a span { } .ui-tabs-nav a { } .ui-tabs-nav .ui-tabs-selected a { } .ui-tabs-nav a span { } .ui-tabs-nav .ui-tabs-selected a span { } .ui-tabs-nav .ui-tabs-selected a, .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active { } .ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active { } .ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:hover span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span { } .ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span { } .ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */ cursor: text; } .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active, .ui-tabs-nav .ui-tabs-deselectable a:hover, .ui-tabs-nav .ui-tabs-deselectable a:focus, .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */ cursor: pointer; } .ui-tabs-disabled { opacity: .4; filter: alpha(opacity=40); } .ui-tabs-panel { } .ui-tabs-loading em { padding: 0 0 0 20px; background: url(loading.gif) no-repeat 0 50%; } /* ColorBox Core Style The following rules are the styles that are consistant between all ColorBox themes */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:visible;} #cboxLoadedContent{overflow:auto;} #cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} /* ColorBox example user style These rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, in hope that this will make the relationship easier to understand. Thanks, jack@colorpowered.com */ #cboxOverlay{background:#000;} #colorbox{} #cboxContent{margin-bottom:40px;} #cboxLoadedContent{background:#000; padding:0px;} #cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;} #cboxLoadingOverlay{background:#000;} #cboxTitle{position:absolute; top:-22px; left:0; color:#000;} #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;} #cboxSlideshow, #cboxPrevious, #cboxNext, {text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) 0 0 no-repeat;} #cboxClose {text-indent:-9999px; width:70px; height:21px; position:absolute; top:500px; left: 105px; background:url(../images/pop_btn_close.png) no-repeat; } #cboxPrevious{background-position:0px 0px; right:44px;} #cboxPrevious.hover{background-position:0px -25px;} #cboxNext{background-position:-25px 0px; right:22px;} #cboxNext.hover{background-position:-25px -25px;} .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;} .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;} .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;} .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;} .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}