body { margin:0; padding:0; font:15px/26px wf_segoe-ui_normal, 'Segoe UI', Arial, Meiryo, Tahoma, sans-serif; color:#333; }
.clear { clear:both;}
.detail {width: 1200px;margin: 0 auto;}
.details {width:1200px; padding:0 5px; margin:0 auto;box-sizing: border-box;}
img{ vertical-align:middle; border:0;}
h1, h2, h3, h4, h5, p, h6, ul, li, ol, dd, dl, dt, input { padding:0; margin:0; list-style:none; font-weight:400;}
a{color: inherit;text-decoration: none;}
a:hover{text-decoration: none;color: inherit;}
/* ----------------- */
.MobleBig{display: none;width: 100%;}
.MobleNav { background: #edf0f2; display: block; height: 65px;  }
.MobleNav .lltab {  padding: 15px 0;  }
.MobleNav .lltab h4 { font-size: 27px;  font-weight: 800; line-height: 35px; display: block; width: 20%; float: left; padding: 0 0 0 1%; }
.MobleNav .lltab h4 a { color: #333; text-decoration: none; }
.MobleNav .lltab h5 { display: block; font-size: 23px;  display: block; width: 150px; float: right; line-height: 35px;  }
.MobleNav .lltab h5 img { vertical-align: middle; }
.MobleNav .lltab h5 a { color: #7dc03b; text-decoration: none; }
.MobleNav .lltab .Huv { width: 35px; height: 35px; float: right; cursor: pointer; }

.Matter {  background: #202020; padding: 20px 0; display: none; position:absolute; top: 65px; z-index: 10; left: 0; width: 100%;  color: #fff; }
.Matter .close { width: 19px; height: 19px; float: right; margin: 0 5% 0 0; cursor: pointer;  }
.Matter ul { font-size: 23px; padding: 20px 5% 0 5%; }
.Matter ul li { list-style: none; border-bottom: 1px solid #4d4d4d; padding: 25px 0 15px; }
.Matter ul li:last-child { border:none;  }
.Matter ul li a { color: #fff; text-decoration: none; }


.Navigate { background:rgba(0,0,0,0.7); padding: 12px 0;}
.Navigate .Logo { width: 155px; float: left; }
.Navigate ul { padding: 12px 0 0 30px; display: block; float: left;  }
.Navigate ul li { display: block; float: left; padding: 0 15px;  }
.Navigate ul li a { color: #fff; }
.Navigate ul li a:hover { color: #1fdaaf; text-decoration: none; }
.Navigate .Other { width: 210px; float: right; }
.Navigate .Other ol { list-style:none; color:#FFF;  float:right; padding: 12px 0 0 0;}
.Navigate .Other ol li { display:block; width:100px; float:left; text-align:center;}
.Navigate .Other ol li a { color: #fff; }
.Navigate .Other ol li a:hover { color: #1fdaaf; text-decoration: none;}

/* ----------------- */
.wp{text-align: center;position: relative;width:1080px; margin:0 auto;padding: 50px 0 30px;}
.wp h1{font-size: 31px;font-weight: 600;line-height: 40px;margin-bottom: 15px;}
.wp h2{font-size: 26px;font-weight: 600;line-height: 1.5;}
.wp h3{font-size: 22px;font-weight: 600;}
.more_fr{position: absolute;right: 0;bottom:30px;}
.more_fr a {display: block;width: 128px;height: 30px;line-height: 30px;font-size: 15px;color: #333333;text-align: center;border: 1px solid #333333;border-radius: 5px;
    -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
.more_fr:hover a {background: #ffa600;color: #fff;border-color: #ffa600;}
.more_m a {display: none;width: 80%;margin: 10 auto;height: 30px;line-height: 30px;font-size: 15px;color: #333333;text-align: center;border: 1px solid #333333;border-radius: 5px;}
/* ----------------- */
.DivMain01{text-align: center;padding: 100px 0;background-color: #f5f3f0;border-bottom: 10px solid #ffffff;}
.DivMain01 h1{font-size: 27px;line-height: 40px;color: #000000;font-weight: 600;}
.DivMain01 .homo-jp-logo{margin-bottom: 30px;}
.DivMain01 .homo-jp-logo img{margin: 0 20px;}
.DivMain01 .homo-jp-logo::after{content: '';display: inline-block;width: 240px;height: 1px;background-color: #c7b3a9;}
.DivMain01 .homo-jp-logo::before{content: '';display: inline-block;width: 240px;height: 1px;background-color: #c7b3a9;}
/* ----------------- */
.DivMain02{background: url("https://www.5kplayer.com/img/home-jp-twenty/product-bg.jpg")no-repeat center;height: 1120px;}
.DivMain02 ul{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center;margin-top: 50px;}
.DivMain02 ul li{width: 582px;height: 360px;border: 1px solid #e1e1e1;border-radius: 3px;margin: 10px 0;overflow: hidden;position: relative;}
.DivMain02 ul li::before{content: '';display: inline-block;width: 68px;height: 32px;background:  url("https://www.5kplayer.com/img/home-jp-twenty/free-logo.png")no-repeat center;position: absolute;top: 15px;right: 15px;z-index: 100;}
.DivMain02 ul li .asd{position: absolute;bottom: 0;text-align: center;left: 0;right: 0;padding: 25px 0;background-color: rgba(250,250,250,0.9);}
.DivMain02 ul li .asd h4{color: #000000;font-size: 27px;font-weight: bolder;}
.DivMain02 ul li .asd p{color: #666666;font-size: 17px;margin-top: 5px;}
.DivMain02 ul li:hover img{transform: scale(1);transition: all 0.6s;}
.DivMain02 ul li:hover img{transform: scale(1.1);}
/* ----------------- */
.DivMain05 ul{padding: 30px 0 50px;}
.DivMain05 ul li{float: left;width: 31%;margin: 0 1%;text-align: center;border: 1px solid #e5e5e5;border-radius: 5px;cursor: pointer;}
.DivMain05 ul li h4{font-size: 18px;font-weight: 600;padding-top: 40px;}
.DivMain05 ul li p{font-size: 15px;padding: 20px 0 50px;}
.DivMain05 ul li .img-box{overflow: hidden;height: 290px;}
.DivMain05 ul li img{width: 100%;transition: all 0.6s;}
.DivMain05 ul li:hover{box-shadow: 0px 5px 20px #e0e3e7;}
.DivMain05 ul li:hover img{transform: scale(1.1);}
/* ----------------- */
.DivMain06 {background: #f5f5f5;padding-bottom: 50px;}
.DivMain06 .left{float: left;width: 59%;}
.DivMain06 .left .category{position: relative;height: 416px;display: none;}
.DivMain06 .left .category.active{display: block;}
.DivMain06 .left .category a{display: block;height: 100%;}
.DivMain06 .left .category .category_left{width: 200px;height: 300px;position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: #fff;z-index: 20;padding: 40px 40px 0 40px;transition: left 1s;}
.DivMain06 .left .category .category_left::after{content: '>';width: 30px;height: 60px;background: #fab325;position: absolute;right: 0px;top:50%;transform: translateY(-50%);text-align: center;line-height: 60px;color: #fff;font-size: 23px;}
.DivMain06 .left .category .category_left h4{font-size: 19px;}
.DivMain06 .left .category .category_left h5{font-size: 19px;}
.DivMain06 .left .category .category_left p{font-size: 15px;}
.DivMain06 .left .category .category_left .line{border-top:1px dashed #b2b2b2;margin: 15px 0;}
.DivMain06 .left .category:hover .category_left{left: 30px;}
.DivMain06 .left .category .category_right{width: 600px;height: 416px;background-position: center center;background-size: cover;background-repeat: no-repeat;position: absolute;right: 0;top: 0;z-index: 10;}
.DivMain06 .right{float: right;width: 40%;}
.DivMain06 .right ul li{background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon1.png")no-repeat 25px center #fff;padding: 40px 0 40px 125px;cursor: pointer;position: relative;}
.DivMain06 .right ul li::before{content: '';position: absolute;width: 3px;top: 50%;bottom:50%;left: 0;background: #ffa600;transition: all 1s;}
.DivMain06 .right ul li:nth-of-type(2){margin: 10px 0;background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon2.png")no-repeat 25px center #fff;}
.DivMain06 .right ul li:nth-of-type(3){background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon3.png")no-repeat 25px center #fff;}
.DivMain06 .right ul li h4{font-size: 21px;}
.DivMain06 .right ul li h5{font-size: 19px;}
.DivMain06 .right ul li.active{background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon1-ac.png")no-repeat 25px center #fff;color: #ffa600;}
.DivMain06 .right ul li.active::before{top: 0;bottom:0;}
.DivMain06 .right ul li.active:nth-of-type(2){background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon2-ac.png")no-repeat 25px center #fff;}
.DivMain06 .right ul li.active:nth-of-type(3){background: url("https://www.5kplayer.com/img/home-jp-twenty/main06-icon3-ac.png")no-repeat 25px center #fff;}
/* ----------------- */
/* 底栏 */
.MainFoot{background: #fff;padding: 50px 0 30px;text-align: left;color: #41444d;font-size: 14px;}
.MainFoot .details{width: 1080px;margin: auto;}
.MainFoot .foot-logo span{color: #f07d0c;font-size: 18px;margin-left: 15px;height:50px; border-left:2px solid #f07d0c;padding:0 10px;position: relative;top:5px;}
.MainFoot .foot-list{padding: 50px 0;border-bottom: 1px solid #ddd;}
.MainFoot .foot-list h5{font-size: 19px;color: #f07d0c;padding-bottom: 30px;}
.MainFoot .foot-list ul{width: 30%;float: left;}
.MainFoot .foot-list ul:nth-of-type(2){margin: 0 5%;}
.MainFoot .foot-list ul li{margin-bottom: 24px;}
.MainFoot .foot-list ul li a{color: #0B1938;display: block;position: relative;display: block;background: url("https://www.5kplayer.com/img/home-jp-twenty/next.png")no-repeat right center;background-size: 17px;background-position-x: 280px;transition: background-position-x .5s ease;}
.MainFoot .foot-list ul li a:hover{color: #f08618;background-position-x: 311px;}
.MainFoot .website-records{text-align: center;padding-top: 20px;}
.MainFoot .website-records p{padding: 5px 0;font-size: 13px;line-height:1.5;}
.MainFoot .website-records a:hover{color: #f07d0c}
.MainFoot .website-records p:nth-of-type(1){font-size: 15px;}
.MainFoot .share{float: left;}
.MainFoot .share a{margin-right:15px;}

@media (max-width: 979px){
	.details {min-width:100%;width: 100%; padding:0 15px; box-sizing: border-box;}
	/* ----------------- */
	.MobleBig{display: block;}
	.Navigate { display: none;}
	.wp{width: 100%;}
	.more_fr{right: 30px;}
	/* ----------------- */
	.DivMain01{padding: 50px 0;}
	.DivMain01 h1{font-size: 21px;line-height: 32px;}
	.DivMain01 .homo-jp-logo::after{display: none;}
	.DivMain01 .homo-jp-logo::before{display: none;}
	/* ----------------- */
	.DivMain02{padding-bottom: 30px;height: auto;background: #f5f5f5;border-bottom: 3px solid transparent;border-image: linear-gradient(to right, #ff6480, #ffd47d);border-image-slice: 10;}
	.DivMain02 ul{justify-content: center;}
	/* ----------------- */
	.DivMain05 ul li h4{padding-top: 15px;}
	.DivMain05 ul li p{padding: 15px 0;}
	.DivMain05 ul li .img-box{height: auto;}
	/* ----------------- */
	.MainFoot{padding: 30px 0;font-size: 15px;}
    .MainFoot .detail{width: 100%;padding: 0 15px;box-sizing: border-box;}
    .MainFoot .foot-list{padding: 30px 0;}
    .MainFoot .foot-list ul{min-width: 324px;}
}
	
@media (max-width: 767px) {
	.wp{padding: 30px 0;}
	.more_fr{position: relative;display: inline-block;right: 0;bottom: 0;margin-top:10px;}
		/* ----------------- */
	.DivMain01 h1{font-size: 19px;line-height: 28px;}
	/* ----------------- */
	.DivMain02 ul li .asd h4{font-size: 21px;}
	.DivMain02 ul li .asd p{font-size: 15px;}
	/* ----------------- */
	.DivMain05 ul li{width: 100%;margin: 10px 0;}
	/* ----------------- */
	.DivMain06 .left{width: 100%;}
	.DivMain06 .right{width: 100%;}
	/* ----------------- */
	.MainFoot{padding: 30px 0;font-size: 13px;}
    .MainFoot .foot-logo{text-align: center;}
    .MainFoot .foot-list{display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;border-bottom: none;}
    .MainFoot .foot-list h5{padding-bottom: 15px;}
    .MainFoot .foot-list ul{width: 100%;float: none;}
    .MainFoot .foot-list ul:nth-of-type(2){margin: 0;}
    .MainFoot .foot-list ul li{padding: 5px 0;border-bottom:1px solid #d0d0d0;}
    .MainFoot .foot-list ul li a{padding: 5px 0 20px;}
    .MainFoot .foot-list ul li a{color: #0B1938;display: block;position: relative;display: block;background: url("https://www.5kplayer.com/img/next.png")no-repeat right center;background-size: 17px;background-position-x: 100%;transition:none;}
    .MainFoot .foot-list ul li a:hover{color: #f08618;background-position-x: 100%;}
    .MainFoot .website-records{padding-top: 15px;}
    .MainFoot .website-records p:nth-of-type(1){font-size: 13px;}
}
	
@media (max-width: 479px) {
	body { margin:0; padding:0; font:13px/23px wf_segoe-ui_normal, 'Segoe UI', Arial, Meiryo, Tahoma, sans-serif; color:#333; text-align:justify; }
	.wp{padding: 30px 0;}
	.wp h1{font-size: 19px;line-height: 1.5;}
	.more_m {text-align: center;padding: 15px 0;}
	.more_m a {display: inline-block;}
	.more_fr {display: none;}
	/* ----------------- */
	.DivMain01{padding: 30px 0;}
	.DivMain01 .homo-jp-logo img{width: 80%;margin: 0;}
	/* ----------------- */
	.DivMain02 ul{margin-top: 0;}
	.DivMain02 ul li{height: 300px;width: 100%;}
	/* ----------------- */
	.DivMain05 ul{padding: 0;}
	/* ----------------- */
	.DivMain06 {padding: 0 0 15px;}
}