@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/*----------------------------------------------------------------
	.top
----------------------------------------------------------------*/
.top{
	position:relative;
	height:1500px;
	background:url(../images/common/bg.gif) repeat;
	padding:0 0 45px 0;
}

.top .loader_bg{
	position:absolute;
	top:0;
	left:0;
	z-index:1000;
	width:100%;
	height:1500px;
	background:url(../images/common/bg.gif) repeat #fff;
}

.top .loader_bg .loader{
	width:100%;
	height:1500px;
	background:url(../images/top/loader.gif) no-repeat center 200px;
}

.top .section{
	width:940px;
	margin:0 auto;
}

.top .main{
	position: relative;
	padding:8px 0 8px 0;
}

.top .s_box{
	position:relative;
	width:229px;
	height:229px;
}

.top .main .banner-insta{
	position: absolute;
	left: -110px;
	top: -9px;
	z-index: 10;
	-webkit-transition: top 300ms ease;
    -moz-transition: top 300ms ease;
    -o-transition: top 300ms ease;
    transition: top 300ms ease;
}

.top .main .banner-insta a{
	outline: none;
}

.top .main .banner-insta:hover{
	top: 0px;
}

.top .main .main_visual{
	float:left;
	width:454px;
	height: 454px;
	display:block;
	position:relative;
	border:6px solid #ffff00;
	border:6px solid rgba(255,255,0,0.5);
	overflow: hidden;
}

.top .main .main_visual a{
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 454px;
	height: 454px;
}

.top .main .main_visual a .img{
	position: absolute;
	left: 0px;
	top: 0;
	width: 454px;
	height: 454px;
}

.top .main .main_visual_02{
	position:relative;
	float:right;
}

.top .main .main_visual_02 a{
	width:454px;
	height: 454px;
	display:block;
	position:relative;
	border:6px solid #7fde97;
	border:6px solid rgba(0,189,47,0.5);
	overflow: hidden;
}

.top .main .main_visual_02.new:after{
	content: "";
    height: 68px;
    width: 68px;
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
	background:url(../images/top/icon_new01.png) no-repeat;
	z-index:10;
}

/*  ====================================== 
	.c1000_clock
	====================================== */
.top .first_sec .c1000_clock{
	width:466px;
	height: 466px;
}

.top .first_sec .c1000_clock .inner_box{
	width:454px;
	height: 454px;
	border: 2px #7fde97 solid;
	padding: 4px;
	cursor: pointer;
}

.top .first_sec .c1000_clock .inner_box .bg_list{
	width:454px;
	height: 454px;
	position: relative;
	z-index: 0;
}

.top .first_sec .c1000_clock .inner_box .bg_list li{
	position: absolute;
	left: 0;
	top: 0;
	width: 454px;
	height: 454px;
}

.top .first_sec .c1000_clock .inner_box .bg_list li > div{
	width: 227px;
	height: 227px;
	position: absolute;
	overflow: hidden;
}

.top .first_sec .c1000_clock .inner_box .bg_list li > div > img{
	position: relative;
}

.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart01{left: 227px;top: 0;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart02{left: 227px;top: 227px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart03{left: 0px;top: 227px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart04{left: 0px;top: 0px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart01 > img{left: -227px;top: 0px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart02 > img{left: -227px;top: -227px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart03 > img{left: 0px;top: -227px;}
.top .first_sec .c1000_clock .inner_box .bg_list li > div.bgPart04 > img{left: 0px;top: 0px;}


.top .first_sec .c1000_clock .inner_box .logo{
	position: absolute;
	right: 13px;
	top: 15px;
	z-index: 20;
	padding: 0;
	margin: 0;
	width: 119px;
	height: 53px;
}

.top .first_sec .c1000_clock .inner_box .logo >div{position: absolute;}
.top .first_sec .c1000_clock .inner_box .logo .logo01{left:0; top:0;}
.top .first_sec .c1000_clock .inner_box .logo .logo02{left:26px; top:0;}
.top .first_sec .c1000_clock .inner_box .logo .logo03{left:41px; top:0;}
.top .first_sec .c1000_clock .inner_box .logo .logo04{left:68px; top:0;}
.top .first_sec .c1000_clock .inner_box .logo .logo05{left:95px; top:0;}
.top .first_sec .c1000_clock .inner_box .logo .logo06{left:0px; top:30px;}
.top .first_sec .c1000_clock .inner_box .logo .logo07{left:27px; top:30px;}
.top .first_sec .c1000_clock .inner_box .logo .logo08{left:44px; top:30px;}
.top .first_sec .c1000_clock .inner_box .logo .logo09{left:71px; top:30px;}
.top .first_sec .c1000_clock .inner_box .logo .logo10{left:97px; top:30px;}

.top .first_sec .c1000_clock .inner_box .logo img{
	vertical-align: top;
}

.top .first_sec .c1000_clock .inner_box .clock{
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 10;
	width: 132px;
	height: 132px;
}

.top .first_sec .c1000_clock .inner_box .clock >div{
	position: absolute;
	left: 0;
	top: 0;
	width: 132px;
	height: 132px;
}

.top .first_sec .c1000_clock .inner_box .copy_bg{
	position: absolute;
	left: 6px;
	bottom: 6px;
	z-index: 5;
	width: 454px;
	height: 56px;
	background-image: url(../images/top/clock/copy_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.top .first_sec .c1000_clock .inner_box .copy{
	position: absolute;
	z-index: 10;
	left: 25px;
	bottom: 8px;
	font-family: "Noto Sans Japanese";
	font-weight: 100;
	color: white;
	font-size: 1.1em;
	line-height: 1em;
}

.top .first_sec .c1000_clock .inner_box .copy br{
	display: none;
}

.top .first_sec .c1000_clock .inner_box .cover{
	position: absolute;
	left: 6px;
	top: 6px;
	width: 454px;
	height: 454px;
	background-color: #00bd2f;
	z-index: 1000;
	display: none;
}




.top .first_sec .box .items li{
	width:466px;
	height:229px;
	position:absolute;
}

.top .first_sec .box .items li a{
	display:block;
	width:466px;
	height:229px;
	position:relative;
}

.top .first_sec .box .items li a.coming{
	cursor:default;
}

.top .first_sec .box .items li a .coming_icon{
	position:absolute;
	left:0;
	top:0;
	width:466px;
	height:229px;
	background:url(../images/top/coming_soon.png) center center no-repeat;
	z-index:100;
	display:none;
}

.top .first_sec .box .items li a.coming .coming_icon{
	display:block;
}

.top .first_sec .box .items li .s_box{
	background:#ffff00 url(../images/top/icon_arrow.png) no-repeat 174px 174px;
	position:absolute;
	text-align:center;
	z-index:0;
}


.top .first_sec .box .items li.item01{
	top:0;
	background:url(../images/top/update_file/item_img01.png) no-repeat left top;
}

.top .first_sec .box .items li.item01 .s_box{
	right:0;
}

.top .first_sec .box .items li.item01 .s_box:after{
	content: "";
    font-size: 0;
    line-height: 0;
    height: 0;
    width: 0;
    display: block;
    position: absolute;
    left: -20px;
    top: 50%;
    border-bottom: 20px solid transparent;
    border-left: 0px solid transparent;
    border-right: 20px solid #ffff00;
    border-top: 20px solid transparent;
    margin-top: -20px;
}

.top .first_sec .box .items li.item02{
	bottom:0;
	background:url(../images/top/update_file/item_img02.png) no-repeat right top;
}

.top .first_sec .box .items li.item02 .s_box{
	left:0;
}

.top .first_sec .box .items li.item02 .s_box:after{
	content: "";
    font-size: 0;
    line-height: 0;
    height: 0;
    width: 0;
    display: block;
    position: absolute;
    right: -20px;
    top: 50%;
    border-bottom: 20px solid transparent;
    border-right: 0px solid transparent;
    border-left: 20px solid #ffff00;
    border-top: 20px solid transparent;
    margin-top: -20px;
}

.top .section ul.box_list{
	padding:0 0 8px 0;
}

.top .section ul.box_list li.box{
	width:466px;
	height:466px;
	position:relative;
}

.top .section ul.box_list li.left{
	float:left;
}

.top .section ul.box_list li.right{
	float:right;
}

.top .section ul.box_list li.box a{
	display:block;
	width:466px;
	height:466px;
	position:relative;
}

.top .section ul.box_list li.box a.cover_img{
	position:absolute;
	left:0;
	top:0;
	z-index:10;
}

.top .section ul.box_list li.y img,
.top .section ul.box_list li.y iframe{
	border:6px solid #ffff00;
	border:6px solid rgba(255,255,0,0.5);
}

.top .section ul.box_list li.g img,
.top .section ul.box_list li.g iframe{
	border:6px solid #7fde97;
	border:6px solid rgba(0,189,47,0.5);
}

.top .section ul.box_list li.y.new:after,
.top .section ul.box_list li.box .s_box .new:after{
	content: "";
    height: 68px;
    width: 68px;
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
	background:url(../images/top/icon_new02.png) no-repeat;
	z-index:10;
}

.top .section ul.box_list li.g.new:after{
	content: "";
    height: 68px;
    width: 68px;
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
	background:url(../images/top/icon_new01.png) no-repeat;
	z-index:10;
}

.top .more_btn{
	
}

.top .more_btn a{
	display:block;
	width:928px;
	height:68px;
	border:6px solid #7fde97;
	border:6px solid rgba(0,189,47,0.5);
	background-image:url(../images/top/icon_loader.gif);
	background-repeat:no-repeat;
	background-position:center center;
	position:relative;
}

.top .more_btn a .cover{
	width:928px;
	height:68px;
	background:#00bd2f;
	position:absolute;
	left:0;
	top:0;
	display:none;
}