@charset "utf-8";
/* CSS Document */
body , a{ color:#443425;font-family:Lato, Meiryo, Osaka, verdana, Arial, Tahoma, sans-serif; }
.top{ background:url(images/top_bg.jpg) center top no-repeat; }
.top .container{ height:682px; position:relative; }
.top .tglogo{ position:absolute; left:37px; top:52px; z-index:2; }
.top .subject{ width:1133px; height:319px; background:url(images/subject.png) no-repeat; position:absolute; left:-46px; top:0; z-index:1; }
.top .subject h2{ visibility:hidden; }
.top .prople{ width:338px; height:422px; background:url(images/people.png) no-repeat; position:absolute; bottom:-5px; left:50%; margin-left:-169px; }
.share{ font-size:16px; font-weight:bold; line-height:34px; position:absolute; right:41px; top:296px; z-index:3; }
.share a{ display:inline-block; width:32px; height:32px; border-radius:50%; margin-left:10px; background-image:url(https://images.wondershare.jp/style/images/share_ico.png); background-repeat:no-repeat; float:right; }
.share a.ptwitter{ background-position:center 1px; background-color:#20a8e3; }
.share a.ptwitter:hover{ background-color:#008ac6; }
.share a.pfacebook{ background-position:center -38px; background-color:#37559d; }
.share a.pfacebook:hover{ background-color:#0c328e; }
.share a.pgoogle{ background-position:center -77px; background-color:#f0661a; }
.share a.pgoogle:hover{ background-color:#c94700; }

.btnsa{ display:inline-block; padding:13px 25px 13px 16px; font-size:26px; line-height:33px; color:#fff; background-color:#a15272; font-weight:bold; border-radius:6px; }
.btnsa span{ display:inline-block; width:40px; height:33px; float:left; margin-right:15px; background-image:url(images/win_mac.png); background-repeat:no-repeat; }
.btnsa.mac span{ background-position:0 0; }
.btnsa.win span{ background-position:100% 100%; }
.btnsa:hover{ text-decoration:none; background-color:#954062; }
@media (min-width:768px) and (max-width: 979px) {
	.btnsa{ font-size:20px; padding:10px; line-height:25px; }
	.btnsa span{ width:30px; height:25px; background-size:100% auto; }
	.top .subject{ background-size:75% auto; top:45px; }
}
@media (max-width: 767px) {
	.top .subject{ background-image:none; width:auto; height:auto; position:static; }
	.top .prople{ width:240px; height:313px; margin-left:-120px; background-size:100% 100%; }
	.top .subject h2{ visibility:visible; padding-top:140px; font-size:18px; text-align:center; }
	.top .subject h2 big{ display:block; font-size:30px; line-height:1; font-weight:bold; padding-bottom:20px; }
	.top .container{ height:auto; padding-bottom:340px; }
	.top{ background-position:center bottom; }
	.share{ position:static; text-align:right; padding-right:20px; padding-top:20px; }
}
@media (max-width: 479px) {
	.btnsa{ font-size:17px; padding:10px; line-height:21px; }
	.btnsa span{ width:25px; height:21px; margin-right:8px; background-size:100% auto; }
}
.colwhite{ color:#fff; }
.colltred{ color:#ffccd0; }
.coldark{ color:#876479; }
.music_box{ background:url(images/linebg.jpg) top repeat-x #986c80; padding-top:20px; }
.music_box .music{ padding-top:37px; padding-left:15px; float:left; }
.pro{ width:49.2%; position:absolute; right:0; font-size:18px; line-height:1.4em; z-index:5; }
.music_box .btn{ margin-top:12px; }
.music_box .btn .mac{ margin-right:28px; }
.music_list > ul > li{ width:28%; margin-left:7.6%; float:left; margin-top:45px; box-shadow:5px 10px 10px #8e6879; }
.music_list > ul > li.first{ margin-left:0.5%; }
.music_list > ul > li .title{ font-size:15px; line-height:2.5333em; padding-left:1.333em; background-color:#2e2c36; color:#fff; }
.grid-music-container .video{ width:45%; }
.grid-music-container .video iframe{ width:100%; height:120px; }
.music_menu{ height:495px; background-color:#f6f6f6; border-right:solid 4px #2e2c36; position:relative; }
.music_menu ul{ border:solid 1px #efefef; padding:15px 8px 0; }
.music_menu ul li{ position:relative; height:46px; cursor:pointer; -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s; }
.music_menu ul li a:hover{ text-decoration:none; }
.music_menu ul li .box{ border:solid 1px #efefef; display:block; }
.music_menu ul li .num{ width:47px; line-height:46px; text-align:center; position:absolute; }
.music_menu ul li .num span{ display:inline-block; font-size:15px; font-weight:bold; padding-right:15px; background:url(images/music_num.png) right 21px no-repeat; }
.music_menu ul li p{ padding:6px 0 6px 16px; line-height:16px;  border-left:solid 1px #efefef; margin-left:47px;}
.music_menu ul li.curr .box , .music_menu ul li:hover .box{ position:absolute; width:102%; left:-1%; background-color:#fff; }
.music_menu ul li.curr .num span , .music_menu ul li:hover .num span { background-position:right -25px; }
.music_menu ul li.curr p , .music_menu ul li:hover p{ margin-left:50px; color:#a15272;  }
.music_menu .heart01{ width:100px; height:50px; position:absolute; left:108px; top:-55px; background:url(images/heart_01.png) no-repeat; }
.music_menu .heart02{ width:111px; height:31px; position:absolute; left:108px; top:-34px; background:url(images/heart_02.png) no-repeat; }
.music_menu .heart03{ width:81px; height:53px; position:absolute; left:138px; top:-55px; background:url(images/heart_03.png) no-repeat; }
.music_menu .line{ width:4px; height:76px; background-color:#a15272; position:absolute; right:-4px; top:38px; }
/*.music_menu .line.pos02{ top:134px; }
.music_menu .line.pos03{ top:252px; }*/
.music_box .bolang{ margin-top:65px; height:46px; background:url(images/bolang.png) repeat-x; }
@media (min-width:768px) and (max-width: 979px) {
	.pro{ font-size:18spx; width:45%; }
	.music_list > ul > li{ width:31%; margin-left:3%; }
	.music_list > ul > li.first{ margin-left:0; }
}
@media (max-width:767px){
	.pro{ position:static; width:auto; }	
	.music_box .btn .mac{ margin-right:15px;   }
	.music_list{ width:280px; margin:auto; }
	.music_list > ul > li{ width:100%; margin-left:0; }
	.grid-music-container .video{ width:280px; margin:30px auto 0; }
	.grid-music-container .video iframe{ height:200px; }
}
@media (max-width: 479px) {
	.pro{ font-size:16px; text-align:center; }
}
.game_box{ background:url(images/game_bg.jpg) repeat; font-size:18px; line-height:2em; color:#fff; text-align:center; padding-bottom:70px; }
.game_box .title{ font-size:30px; line-height:1; padding-top:60px; padding-bottom:5px;}
.bottomp{ background-color:#7f4f66; }
.bottomp .text{ padding:5.5%; color:#fff;  }
.bottomp .text .link{ padding-bottom:3.5%; }
.bottomp .text .link a{ color:#fff; display:inline-block; margin-left:5px; margin-right:5px; }
@media (max-width: 479px) {
	.game_box .title{ font-size:24px; }
	.game_box{ font-size:16px; }
}
.lt_float{ width:90px; border:solid 1px #c11815; position:absolute; top:107px; left:-118px; background:url(images/snow_float.jpg) center top no-repeat #fff; }
.lt_float .btn_link{ display:block; padding-top:30px; padding-bottom:30px; font-size:15px; line-height:18px; color:#c11815; font-weight:bold; }
.lt_float .share{ margin:8px; border-top:solid 1px #c11815; padding:8px 20px 12px;  }
.lt_float .share a{ display:inline-block; width:30px; height:30px; margin-top:10px; border-radius:50%; background-image:url(images/share_ico.png); background-repeat:no-repeat; }
.lt_float .share a.ptwitter{ background-position:0 0; background-color:#20a8e3; }
.lt_float .share a.ptwitter:hover{ background-color:#008ac6; }
.lt_float .share a.pfacebook{ background-position:0 -40px; background-color:#37559d; }
.lt_float .share a.pfacebook:hover{ background-color:#0c328e; }
.lt_float .share a.pgoogle{ background-position:0 -79px; background-color:#f0661a; }
.lt_float .share a.pgoogle:hover{ background-color:#c94700; }
.alertInfo{ display:none; }
.alert_bg{ width:100%; height:100%; position:fixed; left:0; top:0; background-color:#000; opacity:0.3; }
.alert_box{ width:315px; height:220px; border:solid 1px #c11815; box-shadow:3px 3px 3px #999; position:fixed; left:50%; top:45%; margin:-110px 0 0 -158px;  color:#c11815; background:url(images/snow_alert.png) 12px 90px no-repeat #fff; text-align:center; line-height:21px;}
.alert_box .title{ margin:15px 10px auto; font-size:18px; line-height:2em; background-color:#cc3333; color:#fff; border-radius:4px; }
.alert_box .num{ padding-top:6px; padding-bottom:30px; font-size:44px; line-height:1; font-weight:bold; }
.alert_box .shutup{ position:absolute; right:-9px; top:-9px;display: inline-block; width: 18px;height: 18px; line-height: 14px;text-align: center;cursor: pointer;color: #fff;border-radius: 50%;background-color: #c11815;  }
.alert_box .shutup:hover{ background-color:#fa2c2c; }
.lt_float_box{ position:relative; width:100%; }