@charset "UTF-8";
/* CSS Document */
/* index */
#index #whatsnew .inner{
    width: 1000px;
    margin: 0 auto;
    position: relative;
}
#index #whatsnew{
	background-color:#298be2;
	color:#FFFFFF;
	padding:24px 0;
	margin-bottom:34px;
    height: 360px;
}
#index #whatsnew a{
	color:#FFFFFF;
}
#index #whatsnew h3{
	font-size:20.9px;
	font-weight:normal;
	margin:0 0 0.5em 0;
    float: left;
}
#index #whatsnew h3 span{
	font-size:12.9px;
}
#index #whatsnew p{
	font-size:15px;
	margin:0 0 0.5em 0;
    text-align: justify;
}
#index #whatsnew p.ichiran{
	font-size:15px;
	margin:0 0 0.5em 0;
	text-align:right;
}
#index #whatsnew p.clear{
    clear: both;
}

#index #whatsnew .bgwid1{
    width: 450px;
    float: left;
    position: absolute;
    left: 0;
}

#index #whatsnew .youtube2 {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
#index #whatsnew  .youtube2 iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
}

#index #whatsnew .bgwid1 img{
    width: 450px;
    height: auto;
    float: left;
}

#index #whatsnew .banner{
    padding-top: 30px;
 }
#index #whatsnew .bgwid2{
    width: 500px;
    position: absolute;
    right: 0;
}
#index #whatsnew .bgwid2 table{
    width: 100%;
}
#index #whatsnew .bgwid2 table td:first-child{
    width: 80px;
}
#wid_text{
    width: 400px;
    margin: 0 auto;
}    
.text{
    width: 370px;
    height: 20px;
    overflow: hidden;
    text-align: left;
    float: left;
    padding-top: 2px;
    padding-right: 5px;
} 
#wid_text span::after{
    content: '...';
}

#index .btn3{
	font-size:0;
	text-align:center;
}
#index .btn3 a{
	display:inline-block;
	width:31.5%;
	margin:10px 0 10px 2.75%;
}
#index .btn3 a:first-child{
	margin:10px 0 10px 0;
}
#index .btn3 a img{
	width:100%;
}
#index .btn5{
}
#index .btn5 ul{
	margin:0;
	padding:0;
	font-size:0;
}
#index .btn5 li{
	display:inline-block;
	width:18.6%;
	margin:0 0 0 1.75%;
	padding:0;
}
#index .btn5 li:nth-child(1),#index .btn5 li:nth-child(6),#index .btn5 li:nth-child(11){
	margin:0 0 0 0;
}
#index .btn5 li img{
	width:100%;
}
#index .btn5 a:hover{
	opacity:1.0;
}
.title-index{
	font-size:27.97px;
	font-weight:normal;
	border-bottom:1px solid #000000;
}
.title-index span{
	font-size:17.26px;
}
#topimg{
	position:relative;
	z-index:1;
}
#topimg h2{
	display:none;
}



@media screen and (max-width: 768px) {
	
	/* index */
	#whatsnew .bgwid2{
		padding:20px;
	}
	#index .btn5 li{
		width:30.3%;
		margin:0px 1.5%;
	}
	#index .btn5 li:nth-child(1),#index .btn5 li:nth-child(6),#index .btn5 li:nth-child(11){
		margin:0px 1.5%;
	}
}
@media screen and (max-width: 480px) {
	/* index */
	#index .btn3 a{
		width:46%;
		margin:10px 2%;
	}
	#index .btn3 a:first-child{
		margin:10px 2%;
	}
	#index .btn5 li{
		width:46%;
		margin:0px 2%;
	}
	#index .btn5 li:nth-child(1),#index .btn5 li:nth-child(6),#index .btn5 li:nth-child(11){
		margin:0px 2%;
	}


    /* index */
    #index #whatsnew {
        /*padding:24px 0;
        margin-bottom:34px;*/
        height: 580px;
        position: relative;

    }
    #index #whatsnew .inner{
        clear: both;
        width: 100%;
        margin: 0 auto;
    }
    #index #whatsnew h3{
        font-size:18px;
        font-weight:bold;
        position: absolute;
        left: 13%;
    }
    #index #whatsnew h3 span{
        font-size:12.9px;
    }
    #index #whatsnew p{
        font-size:12px;
        margin:0 0 0.5em 0;
        text-align: justify;
    }    
    #index #whatsnew .bgwid1{
        clear: both;
        width: 100%;
        float: none;
    }
    #index #whatsnew .bgwid1 img{
        clear: both;
        width: 90%;
        padding: 0 5%;
    }
    
    #index #whatsnew .bgwid2{
        clear: both;
        width: 100%;
        position: absolute;
        top: 230px;
    }
    #index #whatsnew .bgwid2 table{
        width: 90%;
        position: absolute;
        left: 10%;
        top:60px;
    }
    #index #whatsnew .bgwid2 table td:first-child{
        width: 30%;
        font-size: 12px;
    }
    #wid_text{
        width: 90%;
        margin: 0 auto;
    }    
    .text{
        width: 90%;
        height: 15px;
        overflow: hidden;
        text-align: left;
        float: left;
        padding-right: 5px;
        padding-top: 3px;
    } 
    #wid_text span::after{
        content: '...';
    }	
}

