@font-face {
font-family: "energy";
font-size: 19px;
src: url('fonts/Bank Sans EF CY Medium.otf') format("opentype")
}

body {
min-height: 100dvh;
margin: 0;
background: url('images/monster/bg.png') center fixed;
background-repeat: no-repeat;
background-attachment: fixed;
}

.main {
display: flex;
flex-direction: column;
align-items: center;
}

.header {
padding-bottom: 20px;
}

.header-container {
display: flex;
flex-direction: column;
align-items: center;
}

#header-logo {
width: 700px;
margin-top: 40px;
}

.header-nav a {
font-family: "energy";
font-size: 24px;
color: #66b9e5;
padding-left: 8px;
padding-right: 8px;
text-decoration: none;
-webkit-text-stroke: 5px rgb(110, 110, 110); 
paint-order: stroke fill; 
}

.header-nav {
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 8px;
}

#tear {
position: fixed;
top: 0px;
right: 0px;
perspective: 800px;
}

.mp {
background: url('player/bg.png');
font-family: "MS PGothic", Sans-Serif;
font-weight: 400;
padding: 4px;
width: 320px;
height: 87px;
border-radius: 5px;
margin-left: 66px;
margin-top: 78px;
filter: sepia(100%) hue-rotate(59deg);
box-shadow: inset 0 0 10px #000000;
}

.mp img {
pointer-events: none;
}

#music-player-container {
background: url('player/player.png');
width: 525px;
height: 310px;
position: fixed;
bottom: 20px;
left: 20px;
perspective: 800px;
}

#source {
display: flex;
flex-direction: row;
align-items: center;
gap: 4px;
margin-top: 4px;
}

#controls {
justify-content: space-between;
display: flex;
flex-direction: row;
margin-left: -6px;
}

#display {
display: flex;
flex-direction: row;
justify-content: space-between;
}

#mp-source-icon {
  width: 16px;
  height: 16px;
}

#mp-source-label {
font-size: 12px;
font-weight: bold;
}

.mp-visualizer {
display: flex;
align-items: flex-end;
gap: 2px;
height: 24px;
margin-bottom: 6px;
width: 80px;
}
.mp-bar {
flex: 1;
background: #3b3b3b;
height: 2px;
}

.mp-track-display {
display: flex;
align-items: center;
gap: 4px;
background: #757575;
padding: 4px 6px;
position: relative;
margin-bottom: 6px;
width: 222px;
}

.mp-track-scroll-wrap {
overflow: hidden;
flex: 1;
white-space: nowrap;
}

.mp-track-scroll {
display: inline-block;
}

.mp-track-scroll.scrolling {
animation: mp-marquee 10s steps(1, end) infinite;
}

@keyframes mp-marquee {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}

.mp-dropdown-btn {
background: none;
border: none;
cursor: pointer;
padding: 0 4px;
}

#mp-dropdown-icon.open {
transform: rotate(180deg);
}

.mp-playlist-dropdown {
list-style: none;
margin: 0;
padding: 4px 0;
position: absolute;
top: 100%;
left: 0;
right: 0;
background: #757575;
border-radius: 4px;
max-height: 160px;
overflow-y: auto;
display: none;
z-index: 100000000000;
font-size: 12px;
}

.mp-playlist-dropdown.open {
display: block;
}

.mp-playlist-dropdown li {
padding: 6px 10px;
cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.mp-playlist-dropdown li:hover {
background: rgba(255, 255, 255, 0.1);
}

.mp-playlist-dropdown li.active {
font-weight: bold;
}

.mp-progress-row {
display: flex;
align-items: center;
margin-bottom: 6px;
}

.mp-time {
font-size: 12px;
min-width: 32px;
text-align: center;
font-weight: bold;
}

input[type="range"] {
-webkit-appearance: none;
flex: 1;
height: 8px;
background: #666666b0;
outline: none;
}

input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
width: 8px;
height: 12px;
background: #000000;
cursor: pointer;
}

input[type="range"]::-moz-range-thumb {
width: 8px;
height: 12px;
background: #000000;
border: none;
cursor: pointer;
}

.mp-controls {
display: flex;
align-items: center;
}

.mp-btn {
background: none;
border: none;
cursor: pointer;
display: inline-flex;
justify-content: center;
align-items: center;
}

.mp-btn-icon {
width: 16px;
height: 16px;
}

.mp-btn:hover {
background: rgba(255, 255, 255, 0.1);
}

.mp-volume-row {
display: flex;
align-items: center;
gap: 2px;
}

.mp-volume {
flex: 1;
}

#jvc-download-window {
	width: 850px;
	height: 712px;
	background: url('bg/bgdark1.png');
	margin-bottom: 6px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	filter: drop-shadow(0 0 0.5rem black);
  padding-top: 20px;
  padding-bottom: 20px;
  margin-top: 40px;
  margin-bottom: 80px;
}

#jvc-download-window-header {
	width: 640px;
	height: 76px;
	background-color: black;
	display: flex;
	flex-direction: row;
}

#jvc-download-window-header-left {
	width: 11px;
	height: 76px;
	background: url("images/jvcdl/pd_navi_left.gif");
}

#jvc-download-window-header-center {
	width: 618px;
	height: 76px;
	display: flex;
	flex-direction: column;
}

#jvc-download-window-header-right {
	width: 11px;
	height: 76px;
	background: url("images/jvcdl/pd_navi_right.gif");
}

#jvc-download-window-header-center-top {
	width: 618px;
	height: 42px;
	background: url("images/jvcdl/pd_navi_center.gif");
}

#jvc-download-window-header-center-middle {
	width: 618px;
	height: 22px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: gray;
}

#jvc-download-window-header-center-middle-home-button {
	width: 153px;
	height: 22px;
	background: url("images/jvcdl/pd_navi_home_off.gif");
}

#jvc-download-window-header-center-middle-what-button {
	width: 153px;
	height: 22px;
	background: url("images/jvcdl/pd_navi_whats_off.gif");
}

#jvc-download-window-header-center-middle-download-button {
	width: 153px;
	height: 22px;
	background: url("images/jvcdl/pd_navi_download_on.gif");
}

#jvc-download-window-header-center-middle-faq-button {
	width: 153px;
	height: 22px;
	background: url("images/jvcdl/pd_navi_faq_off.gif");
}

#jvc-download-window-header-center-bottom {
	width: 618px;
	height: 12px;
	background: url("images/jvcdl/pd_navi_botom.gif");
}

#jvc-download-window-content {
	background-color: rgb(102, 102, 102);
	width: 640px;
	height: 596px;
	display: flex;
	justify-content: center;
	align-items: center;
	image-rendering: auto;
}

#jvc-download-window-content-inner {
	background: white;
	width: 620px;
	height: 586px;
	align-items: center;
	display: flex;
	flex-direction: column;
}

#jvc-download-window-content-inner-top {
	width: 620px;
	height: 22px;
	display: flex;
	flex-direction: row;
}

#jvc-download-window-content-inner-top-left {
	width:  369px;
	height: 22px;
	background: url("images/jvcdl/pd_dl_2004.gif");
}

#jvc-download-window-content-inner-top-right {
	width: 251px;
	height: 22px;
	display: flex;
	justify-content: right;
	align-items: bottom right;
	background-color: rgb(102, 102, 102);
}

#jvc-download-window-content-inner-top-right-inner {
	width: 245px;
	height: 22px;
	background: url("images/jvcdl/pd_dl_important.gif");
}

#jvc-download-window-content-inner-main {
margin-top: 10px;
width: 600px;
display: flex;
flex-direction: row;
align-items: top;
justify-content: space-between;
}

#jvc-download-window-content-inner-main-models {
	width: 290px;
	height: 201px;
	display: flex;
	flex-direction: column;
}

#jvc-download-window-content-inner-main-models-title {
	width: 290px;
	height: 20px;
	background: url("images/jvcdl/pd_dl_title4.gif");
}

#jvc-download-window-content-inner-main-models-showcase {
	width: 290px;
	height: 119px;
	background: url("images/jvcdl/pd_dl_photo5.jpg");
}

#jvc-download-window-content-inner-main-models-list {
	width: 290px;
	height: 57px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	font-size: 9pt;
    line-height: 11pt;
    font-family: "Arial";
}

#jvc-download-window-content-inner-main-models-list-america {
	width: 92px;
	height: 57px;
}

#jvc-download-window-content-inner-main-models-list-america-image {
	width: 92px;
	height: 22px;
	background: url("images/jvcdl/pd_dl_america.gif");
}

#jvc-download-window-content-inner-main-models-list-america-text {
	width: 73px;
	height: 33px;
	display: flex;
	flex-direction: column;
}

#jvc-download-window-content-inner-main-models-list-america-text-top {
	width: 73px;
	height: 16px;	
	display: flex;
	flex-direction: row;
}

#jvc-download-window-content-inner-main-models-list-america-text-top-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-america-text-top-2 {
	width: 59px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-america-text-top-3 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-america-text-bottom {
	width: 73px;
	height: 16px;	
	display: flex;
	flex-direction: row;
}

#jvc-download-window-content-inner-main-models-list-america-text-bottom-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-america-text-bottom-2 {
	width: 59px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-america-text-bottom-3 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-europe {
	width: 92px;
	height: 57px;	
}

#jvc-download-window-content-inner-main-models-list-europe-image {
	width: 92px;
	height: 22px;
	background: no-repeat url("images/jvcdl/pd_dl_euro.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-europe-text {
	width: 66px;
	height: 33px;
	display: flex;
	flex-direction: column;
}

#jvc-download-window-content-inner-main-models-list-europe-text-top {
	width: 66px;
	height: 16px;
	display: flex;
	flex-direction: row;
}

#jvc-download-window-content-inner-main-models-list-europe-text-bottom {
	width: 66px;
	height: 16px;
	display: flex;
	flex-direction: row;
}

#jvc-download-window-content-inner-main-models-list-europe-text-top-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-europe-text-top-2 {
	width: 52px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-europe-text-top-3 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-europe-text-bottom-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-europe-text-bottom-2 {
	width: 52px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-europe-text-bottom-3 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-asia {
	width: 92px;
	height: 57px;	
}

#jvc-download-window-content-inner-main-models-list-asia-image {
	width: 92px;
	height: 22px;	
	background: no-repeat url("images/jvcdl/pd_dl_asiaoceania.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-asia-text {
	width: 66px;
	height: 33px;	
	display: flex;
	flex-direction: column;
}

#jvc-download-window-content-inner-main-models-list-asia-text-top {
	width: 66px;
	height: 16px;
	display: flex;
	flex-direction: row;	
}

#jvc-download-window-content-inner-main-models-list-asia-text-bottom {
	width: 66px;
	height: 16px;
	display: flex;
	flex-direction: row;	
}

#jvc-download-window-content-inner-main-models-list-asia-text-top-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-asia-text-top-2 {
	width: 52px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-asia-text-top-3 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-asia-text-bottom-1 {
	width: 7px;
	height: 16px;
	background: no-repeat url("images/jvcdl/pd_dl_arrow1.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-models-list-asia-text-bottom-2 {
	width: 52px;
	height: 16px;	
}

#jvc-download-window-content-inner-main-models-list-asia-text-bottom-3 {
	width: 7px;
	height: 16px;	
	background: no-repeat url("images/jvcdl/pd_dl_arrow2.gif");
	background-position: center;
}

#jvc-download-window-content-inner-main-download {
	width: 290px;
	height: 235px;
	font-family: "Arial";
	font-size: 12px;
}

#jvc-download-window-content-inner-main-download-title {
	width: 290px;
	height: 20px;
	background: url("images/jvcdl/pd_dl_title2.gif");
}

#jvc-download-window-content-inner-main-download-image {
	width: 290px;
	height: 172px;
	background: url("images/jvcdl/pd_dl_photo2.jpg");
}

#jvc-download-window-content-inner-main-download-text {
	display: flex;
	align-items: center;
	width: 290px;
	height: 30px;
	justify-content: center;
}

#jvc-download-window-content-inner-image {
	
}

#jvc-download-window-content-inner-image-cd {
	width: 300px;
	height: 300px;
}

#jvc-download-window-content-inner-image-cd-link {
	width: 300px;
	height: 300px;
	display: block;
}

#jvc-download-window-content-inner-image-cd-link-image {
	width: 300px;
	height: 300px;
}

#pontiac {
	width: 850px;
	height: 2070px;
	background: url(images/pontiac/backgrnd.gif);
	display: flex;
	flex-direction: column;
	justify-content: start;
	align-items: center;
	margin-bottom: 20px;
	filter: drop-shadow(0 0 0.5rem black);
  padding-bottom: 80px;
  margin-top: 40px;
}

#pontiac-inner {
	width: 750px;
	display: flex;
    flex-direction: column;
    align-items: center;
}

#pontiac-header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: black;
	margin-bottom: 26px;
	height: 30px;
	width: 850px;
	pointer-events: none;
}

#pontiac-gallery {
	width: 388px;
	height: 310px;
	background-color: black;
	padding: 10px;
	border-radius: 4px;
	margin-top: 20px;
}

#pontiac-gallery-header {
	display: flex;
	flex-direction: row;
	justify-content: start;
	margin-bottom: 10px;
}

#pontiac-gallery-buttons {
	display: flex;
	flex-direction: column;
	justify-content: start;
	width: 80px;
}

#pontiac-gallery-buttons-top {
	display: flex;
	flex-direction: row;
	justify-content: space-between:
}

#pontiac-gallery-buttons-bottom {
	display: flex;
	flex-direction: row;
	height:27px;
}

#pontiac-header-right {
	display: flex;
	flex-direction: row;
	align-items: top;
	height: 44px;
	pointer-events: none;
}

#gm-global {
	height: 30px;
	pointer-events: none;
}

#pontiac-gplogo-top {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	pointer-events: none;
}

#pontiac-widerbetter {
	display: flex;
	justify-content: center;
	margin-top: 10px;
	margin-bottom: 10px;
	pointer-events: none;
}

#pontiac-hero {
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 750px;
	height: 192px;
	margin-top: 30px;
	margin-bottom: 10px;
	pointer-events: none;
}

#pontiac-hero img {
	margin-right: 10px;
	pointer-events: none;
}

#pontiac-hero p {
	margin-top: 5px;
	margin-bottom: 0;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	font-size: 13px;
	font-weight: 400;
	text-shadow: 0.5px 0 0 currentColor, 1px 0 0 currentColor;
	color: white;
	text-align: justify;
	width: 135px;
	filter: drop-shadow(1px 1px 2px #840000);
}

#pontiac-gallery-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}

#pontiac-features {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	padding: 20px;
	background: white;
	border: 0.38rem solid black;
    border-radius: 24px;
    width: 667px;

}

#pontiac-features-se, #pontiac-features-gt, #pontiac-features-gtp, #pontiac-features-gpse {
	display: flex;
	flex-direction: row;
	width: 575px;
	background: white;
	padding: 10px;
	pointer-events: none;
}

#pontiac-features-left {
	height: 217px;
	width: 233px;
}

#pontiac-features-right {
	display: flex;
	flex-direction: column;
}

#pontiac-features-right-mid {
	display: flex;
	flex-direction: row;
	height: 73px;
	width: 342px;
	align-items: self-end;
}

#pontiac-features-right-bottom {
	display: flex;
	flex-direction: row;
	align-items: space-between;
	max-width: 342px;
}

#pontiac-features-badge-left {
	height: 55px;
	width: 171px;
}

#pontiac-features-badge-right {
	height: 38px;
	width: 171px;
}

#pontiac-features-right-mid-bottom {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
    font-size: 13px;
	font-weight: 400;
	text-shadow: 0.5px 0 0 currentColor, 1px 0 0 currentColor;
	width: 342px;
}

.pontiac-features-column {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	font-size: 13px;
}