﻿@charset "utf-8";

/* ベース */
html,body{
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica,sans-serif;
color:#FFF;
line-height:1.5;
letter-spacing:1.5px;
height:100%;
background:url(../img/bg_body.jpg) no-repeat center center fixed;
background-size:cover;
}

#wrapper{
width:100%;
min-width:1260px;
min-height:100%;
height:auto;
background:url(../img/bg_wrapper.png);
z-index:10;
}

#container{margin:auto;}


header{
position:relative;
width:100%;
min-width:1260px;
height:35px;
border-top:1px solid #295F77;
background:url(../img/bg_header.png) repeat-x bottom center;
z-index:500;
}


nav{
width:1155px;
height:28px;
margin:auto;
}

nav ul li a{
float:left;
display:block;
width:105px;
height:28px;
text-indent:-9999px;
background:url(../img/nav.png) no-repeat;
}

nav ul li a.disable{cursor:default;}

#nav00 a:link{background-position:0px 0px}
#nav01 a:link{background-position:-105px 0px}
#nav02 a:link{background-position:-210px 0px}
#nav03 a:link{background-position:-315px 0px}
#nav04 a:link{background-position:-420px 0px}
#nav05 a:link{background-position:-525px 0px}
#nav06 a:link{background-position:-630px 0px}
#nav07 a:link{background-position:-735px 0px}
#nav08 a:link{background-position:-840px 0px}
#nav09 a:link{background-position:-945px 0px}
#nav10 a:link{background-position:-1050px 0px}

#nav00 a:hover{background-position:0px -28px}
#nav01 a:hover{background-position:-105px -28px}
#nav02 a:hover{background-position:-210px -28px}
#nav03 a:hover{background-position:-315px -28px}
#nav04 a:hover{background-position:-420px -28px}
#nav05 a:hover{background-position:-525px -28px}
#nav06 a:hover{background-position:-630px -28px}
#nav07 a:hover{background-position:-735px -28px}
#nav08 a:hover{background-position:-840px -28px}
#nav09 a:hover{background-position:-945px -28px}
#nav10 a:hover{background-position:-1050px -28px}

#content{background:url(../img/bg_content.jpg);}

section{
clear:both;
width:1260px;
margin:auto;
}

#topic{
padding-top:10px;
padding-bottom:20px;
background:url(../img/bg_topic.png) repeat-x;
}

#update{
position:relative;
z-index:30;
}

#update p{
font-size:13px;
margin-top:11px;
margin-left:90px;
}

#update p span{
margin-right:10px;
}

#recent,#next{
width:620px;
height:40px;
float:left;
margin:5px;
}

#recent{background:url(../img/recent.png) no-repeat;}
#next{background:url(../img/next.png) no-repeat;}

#topic li{
float:left;
margin:10px;
margin-top:0px;
margin-bottom:0px;
}

#title{
width:100%;
height:145px;
background:url(../img/title.jpg) no-repeat;
background-position:center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
border-bottom:solid 1px #FFF;
}

.title{
width:1260px;
padding-top:40px;
margin:auto;
}

#logo{float:left;}
.label{
width:400px;
height:100px;
float:right;
display:block;
background:url(../img/label.png) no-repeat;
text-indent:-9999px;
}

#label00{background-position:0px 0px;}
#label01{background-position:0px -100px;}
#label02{background-position:0px -200px;}
#label03{background-position:0px -300px;}
#label04{background-position:0px -400px;}
#label05{background-position:0px -500px;}
#label06{background-position:0px -600px;}
#label07{background-position:0px -700px;}
#label08{background-position:0px -800px;}
#label09{background-position:0px -900px;}
#label10{background-position:0px -1000px;}
#label11{background-position:0px -1100px;}
#label12{background-position:0px -1200px;}

footer{
position:relative;
width:100%;
min-width:1260px;
clear:both;
padding-top:5px;
padding-bottom:23px;
background:url(../img/bg_header.png) repeat-x bottom center;
}

#copyright p{
clear:both;
text-align:right;
margin:10px;
}

.fade{
-webkit-transition:0.2s ease-in-out;
-moz-transition:0.2s ease-in-out;
-o-transition:0.2s ease-in-out;
transition:0.2s ease-in-out;
}

.fade:hover{
opacity:0.5;
filter:alpha(opacity=50);
}

.banner_float li{
float:left;
display:block;
margin:5px;
}

/**********************************************************************************************************
***********************************************************************************************************/

#visual{
border-top:1px solid #000;
}

#visual_{
position:relative;
width:1260px;
height:120px;
background:url(../img/main.png) no-repeat;
margin-top:10px;
margin-bottom:10px;
}

/*#visual_{
position:relative;
width:1260px;
height:900px;
background:url(../img/main.png) no-repeat;
margin-top:30px;
margin-bottom:10px;
}*/

.updown{
position:absolute;
top:0;
left:0;
z-index:100;
}

#top00{
margin-left:410px;
margin-top:405px;
width:806px;
height:142px;
background:url(../img/top00.png) no-repeat;
}

#top01{
margin-left:500px;
margin-top:690px;
width:713px;
height:147px;
background:url(../img/top01.png) no-repeat;
}

#top02 img{
position:absolute;
margin-left:1060px;
margin-top:640px;
z-index:100;
}

#trial_img img{
position: absolute;
margin-left:640px;
margin-top:500px;

border:5px solid #FFF;

-webkit-border-radius:5px;
-moz-border-radius:5px;

box-shadow:rgba(0, 0, 0, 0.2) 0px 0px 3px 0px;
-webkit-box-shadow:rgba(0, 0, 0, 0.2) 0px 0px 3px 0px;
-moz-box-shadow:rgba(0, 0, 0, 0.2) 0px 0px 3px 0px;

-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);

z-index:50;
}

#index_btn a img{
background:#F60;
width:150px;height:21px;
margin-top:825px;
margin-left:60px;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}

#index_btn a img:hover{
background:#C00;
}

/**********************************************************************************************************
***********************************************************************************************************/

.ui-tabs .ui-tabs-hide{display:none;!important}

.scroll{background:url(../img/bg_scroll.png) repeat-y;}
.page{background:url(../img/bg_page.png) no-repeat;}

.wide{
width:1230px;
margin:auto;
}

/* 全体の高さ */
.narrow{
width:1280px;
height:1450px;
margin:auto;
padding-top:40px;
padding-bottom:00px;
}

a:hover img{
opacity: 0.6;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}


.trans00{}
.trans01{margin-left:15px;}
.trans02{margin-left:25px;}
.trans03{margin-left:35px;}
.trans04{margin-left:45px;}
.trans05{margin-left:55px;}
.trans06{margin-left:65px;}
.trans07{margin-left:75px;}
.trans08{margin-left:85px;}
.trans09{margin-left:95px;}

.trans10{margin-top:100px;margin-left:100px;position:absolute;}

.new{
position:absolute;
z-index:100;
margin-top:-15px;
margin-left:-10px;
}

/**********************************************************************************************************
***********************************************************************************************************/

.slider a{
width:300px;
height:168px;
display:block;
background:url(../img/chara_cg.png) no-repeat;
}

.bx-wrapper {
position:absolute;
width:300px;
height:168px;
margin-top:465px;
margin-left:570px;
}

.bx-wrapper .bx-pager {display:none;}


.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
}

.bx-wrapper .bx-prev {
position:absolute;
margin-left: -40px;
background: url(../img/controls.png) no-repeat 0 -32px;
}

.bx-wrapper .bx-next {
position:absolute;
margin-left: 310px;
background: url(../img/controls.png) no-repeat -43px -32px;
}

.bx-wrapper .bx-prev:hover {
background-position: 0 0;
}

.bx-wrapper .bx-next:hover {
background-position: -43px 0;
}

.bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
width: 32px;
height: 32px;
text-indent: -9999px;
z-index: 9999;
}

.bx-wrapper .bx-controls-direction a.disabled {
display: none;
}

#cg00 a:link{background-position:0px 0px}
#cg01 a:link{background-position:-300px 0px}
#cg02 a:link{background-position:-600px 0px}
#cg03 a:link{background-position:0px -169px}
#cg04 a:link{background-position:-300px -169px}
#cg05 a:link{background-position:-600px -169px}
#cg06 a:link{background-position:0px -338px}
#cg07 a:link{background-position:-300px -338px}
#cg08 a:link{background-position:-600px -338px}
#cg09 a:link{background-position:0px -507px}
#cg10 a:link{background-position:-300px -507px}
#cg11 a:link{background-position:-600px -507px}

/**********************************************************************************************************
***********************************************************************************************************/
/*////////////////////////////////////////////////////////////////////////////////////////*/


/* メインビジュアルの高さ */
#store1{
height:1200px;
background:url(../img/nok3_00_00.png) no-repeat top center;
border-top:1px solid rgba(0,0,0,0);
}


#store1 a img{
display:block;
position:absolute;
}

/* リンクバナー */

#store_link1 a img{
margin-top:1225px;
margin-left:120px;
}

#store_link2 a img{
margin-top:1225px;
margin-left:500px;
}

#store_link3 a img{
margin-top:1225px;
margin-left:880px;
}


/**********************************************************************************************************
***********************************************************************************************************/

#product{
width:1100px;
height:675px;
background:url(../img/product.jpg) no-repeat;
}

#product_btn a img{
background:#300;
width:150px;
height:21px;
margin-top:635px;
margin-left:520px;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}

#product_btn a img:hover{
background:#C00;
}

#loading{
position:absolute;
left:50%;
top:50%;
margin-left:-50px;
}

.modal{
display:none;
position:fixed;
display:none;
z-index:9999;
top:50%;
left:50%;
width:760px;
height:420px;
margin:-280px 0 0 -380px;
padding:20px;
text-align:center;
}

.close_modal{
cursor:pointer;
}

.modal img{
box-shadow:#CCC 1px 1px 4px 1px;
}

/**********************************************************************************************************
***********************************************************************************************************/

#ad{
width:1100px;
height:645px;
background:url(../img/ad.jpg) no-repeat;}

.ad{
width:1100px;
height:645px;
}

.ad_nav li a{
float:left;
display:block;
width:225px;
height:180px;
margin-left:30px;
margin-right:-30px;
margin-top:88px;
margin-bottom:-88px;
text-indent:-9999px;
-webkit-transition:0.5s;
-moz-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;
background:url(../img/ad_nav.jpg) no-repeat;}

.ad01 a:link{background-position:0px 0px; opacity:0;}
.ad02 a:link{background-position:-225px 0px; opacity:0;}
.ad03 a:link{background-position:-450px 0px; opacity:0;}
.ad04 a:link{background-position:-675px 0px; opacity:0;}

.ad01 a:hover{background-position:0px 0px; opacity:1;}
.ad02 a:hover{background-position:-225px 0px; opacity:1;}
.ad03 a:hover{background-position:-450px 0px; opacity:1;}
.ad04 a:hover{background-position:-675px 0px; opacity:1;}

.ad05 a:link{background-position:0px -180px; opacity:0;}
.ad06 a:link{background-position:-225px -180px; opacity:0;}
.ad07 a:link{background-position:-450px -180px; opacity:0;}
.ad08 a:link{background-position:-675px -180px; opacity:0;}

.ad05 a:hover{background-position:0px -180px; opacity:1;}
.ad06 a:hover{background-position:-225px -180px; opacity:1;}
.ad07 a:hover{background-position:-450px -180px; opacity:1;}
.ad08 a:hover{background-position:-675px -180px; opacity:1;}

.ad09 a:link{background-position:0px -360px; opacity:0;}
.ad10 a:link{background-position:-225px -360px; opacity:0;}
.ad11 a:link{background-position:-450px -360px; opacity:0;}

.ad09 a:hover{background-position:0px -360px; opacity:1;}
.ad10 a:hover{background-position:-225px -360px; opacity:1;}
.ad11 a:hover{background-position:-450px -360px; opacity:1;}


/**********************************************************************************************************
***********************************************************************************************************/

