@charset "utf8";
/* --- 全体の背景・テキスト --- */
html,body,span,iframe,p,pre,img,strong,b,i,dl,dt,dd,ol,ul,li,form,label,video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	background-attachment: fixed;
}
h { display:inline; }
body {
	line-height:1;
	width:100vw;
	width:100dvw;
	height:100vh;
	height:100dvh;

}
body.top {
	background-color: #ffb3bd;
	background-image: url(../img/cmn/bg.png);
	background-repeat: repeat;
	background-size: 20px auto;
	color: #666;
}
iframe.main {
	width: 100%;
	height: 100%;
}
iframe.content {
	width: 480px;
	height: 360px;
	overflow:hidden;
}
body.content {
	margin-top: 6px;
	color: #666;
}
/* --- 全体のリンクテキスト --- */
p { color:#fff; line-height:120%; }
a:link, a:visited { color:#030; text-decoration: none; }
a:active { color:#fff; text-decoration: none; }
a:hover { color:#fff; text-decoration: underline; }
/* container */
#container {
	width:778px;
	margin: 0px auto;
	position: relative;
	display: flex;
	flex-flow: column;
	min-height: 100vh;
	min-height: 100dvh;
}
/* header */
#header {
	padding: 8px 56px 0px;
	display: block;
}
/* menu + content	*/
#body {
	width:100%;
	margin: 10px 0;
	display: block;
	flex: 1;
	text-align: center;
}
/* menu	*/
#nav {
	background-repeat: no-repeat;
	float: left;
	text-align: center;
	width: 140px;
	height: 330px;
	margin: 44px 30px 8px 47px;
	padding: 22px 0px;
	display: flex;
	flex-direction: column;
}
#nav li {
	width: 106px;
	height: 80px;
	padding:0px 17px;
	text-align: center;
	list-style: none;
}

#nav li a {
	width: 106px;
	height: 80px;
	text-decoration: none;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
	display: block;
	text-decoration: none;
	background-size:cover;
	margin:0px;
}
#nav li.bottom {
	margin-top: auto;
}
.nav-idx { background: url("../img/cmn/frame_02.gif"); }
.nav-mvs { background: url("../img/cmn/frame_03.gif"); }
#nav li.mvs a{ background-image: url("../img/menu/movies_d.png"); }
#nav li.gms a{ background-image: url("../img/menu/games_d.png"); }
#nav li.wps a{ background-image: url("../img/menu/wp_d.png"); }
#nav li.pts a{ background-image: url("../img/menu/paint_d.png"); }
#nav li.dls a{ background-image: url("../img/menu/dl_d.png"); }
#nav li.rps a{ background-image: url("../img/menu/recipe_d.png"); }
#nav li.top a{ background-image: url("../img/menu/top_d.png"); }
#nav li.mvs a:hover, #nav li.mvs a:active { background-image: url("../img/menu/movies_l.png"); }
#nav li.gms a:hover, #nav li.gms a:active { background-image: url("../img/menu/games_l.png"); }
#nav li.wps a:hover, #nav li.wps a:active { background-image: url("../img/menu/wp_l.png"); }
#nav li.pts a:hover, #nav li.pts a:active { background-image: url("../img/menu/paint_l.png"); }
#nav li.dls a:hover, #nav li.dls a:active { background-image: url("../img/menu/dl_l.png"); }
#nav li.rps a:hover, #nav li.rps a:active { background-image: url("../img/menu/recipe_l.png"); }
#nav li.top a:hover, #nav li.top a:active { background-image: url("../img/menu/top_l.png"); }
/* title */
#title {
	width: 456px;
	height:80px;
	margin: 0px 12px;
}
/* main column */
#content {
	float: left;
	width: 514px;
}
h1 {
	float: left;
	width: 325px;
	height: 19px;
	line-height: 19px;
	margin: 6px 0px 9px 17px;
	text-align:left;
	font-size: 16px;
	font-weight: 400;
	display: inline-block;
	color: #333;
}

/* language list */
#lang {
	float: left;
	width: 150px;
	height: 19px;
	margin: 5px 15px 10px 5px;
	text-align:right;
}
#lang a{ height: 16px; }
#lang #flag{
	width: 16px;
	height: 16px;
	border: none;
	vertical-align: top;
}
.langsel {
	-webkit-appearance: initial;
	-moz-appearance: initial;
	appearance: initial;
	background: url(data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%2016px%3B%20height%3A%2016px%3B%20opacity%3A%201%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%09%3Cpath%20class%3D%22st0%22%20d%3D%22M255.994%2C0.006C114.607%2C0.013%2C0.012%2C114.612%2C0%2C256c0.012%2C141.387%2C114.607%2C255.986%2C255.994%2C255.994%0A%09%09C397.393%2C511.986%2C511.992%2C397.387%2C512%2C256C511.992%2C114.612%2C397.393%2C0.013%2C255.994%2C0.006z%20M97.607%2C97.612%0A%09%09c23.34-23.328%2C51.761-41.475%2C83.455-52.725c-15.183%2C18.375-27.84%2C41.906-37.757%2C69.116H82.772%0A%09%09C87.452%2C108.308%2C92.396%2C102.824%2C97.607%2C97.612z%20M65.612%2C138.003h69.986c-9.008%2C31.929-14.41%2C67.834-15.363%2C105.997H32.327%0A%09%09C34.374%2C205.196%2C46.3%2C169.088%2C65.612%2C138.003z%20M65.612%2C373.997C46.3%2C342.912%2C34.374%2C306.804%2C32.327%2C268h87.991%0A%09%09c0.961%2C38.124%2C6.21%2C74.092%2C15.206%2C105.998H65.612z%20M97.607%2C414.386c-5.211-5.211-10.156-10.695-14.836-16.39h60.573%0A%09%09c4.28%2C11.774%2C9.019%2C22.944%2C14.312%2C33.21c6.954%2C13.438%2C14.758%2C25.468%2C23.348%2C35.89C149.332%2C455.846%2C120.931%2C437.699%2C97.607%2C414.386z%0A%09%09%20M243.998%2C479.667c-3.746-0.196-7.469-0.477-11.164-0.86c-5.89-2.64-11.722-6.25-17.5-10.961%0A%09%09c-17.632-14.359-33.976-38.671-46.398-69.85h75.061V479.667z%20M243.998%2C373.997h-83.436c-9.477-31.171-15.316-67.311-16.328-105.998%0A%09%09h99.763V373.997z%20M243.998%2C244H144.31c1.008-38.71%2C6.875-74.819%2C16.359-105.997h83.33V244z%20M243.998%2C114.003h-74.951%0A%09%09c3.109-7.79%2C6.367-15.312%2C9.934-22.195c10.64-20.625%2C23.17-36.89%2C36.354-47.656c5.777-4.71%2C11.609-8.32%2C17.5-10.96%0A%09%09c3.695-0.382%2C7.417-0.664%2C11.164-0.859V114.003z%20M446.392%2C138.003c19.312%2C31.085%2C31.234%2C67.194%2C33.281%2C105.997h-87.991%0A%09%09c-0.961-38.124-6.21-74.092-15.21-105.997H446.392z%20M414.393%2C97.612c5.211%2C5.211%2C10.156%2C10.696%2C14.836%2C16.391h-60.577%0A%09%09c-4.281-11.773-9.023-22.945-14.312-33.21c-6.953-13.437-14.758-25.468-23.347-35.89C362.668%2C56.16%2C391.065%2C74.301%2C414.393%2C97.612z%0A%09%09%20M267.998%2C32.333c3.746%2C0.195%2C7.469%2C0.484%2C11.16%2C0.859c5.89%2C2.649%2C11.723%2C6.25%2C17.504%2C10.96%0A%09%09c17.636%2C14.359%2C33.976%2C38.671%2C46.397%2C69.85h-75.061V32.333z%20M267.998%2C138.003h83.436c9.476%2C31.171%2C15.32%2C67.31%2C16.328%2C105.997%0A%09%09h-99.764V138.003z%20M267.998%2C268h99.685c-1.007%2C38.71-6.874%2C74.818-16.359%2C105.998h-83.326V268z%20M296.661%2C467.846%0A%09%09c-5.781%2C4.711-11.614%2C8.313-17.504%2C10.961c-3.691%2C0.375-7.414%2C0.664-11.16%2C0.86v-81.67h74.951%0A%09%09c-3.109%2C7.789-6.367%2C15.312-9.933%2C22.195C322.376%2C440.816%2C309.845%2C457.081%2C296.661%2C467.846z%20M414.393%2C414.386%0A%09%09c-23.336%2C23.328-51.764%2C41.476-83.459%2C52.725c15.187-18.375%2C27.835-41.905%2C37.757-69.115h60.538%0A%09%09C424.548%2C403.692%2C419.604%2C409.176%2C414.393%2C414.386z%20M446.392%2C373.997h-69.998c9.008-31.929%2C14.414-67.842%2C15.367-105.998h87.912%0A%09%09C477.626%2C306.804%2C465.704%2C342.912%2C446.392%2C373.997z%22%20style%3D%22fill%3A%20rgb%2875%2C%2075%2C%2075%29%3B%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A) no-repeat	5px 5px / 12px 12px,
	url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E) no-repeat right 3px top 5px / 12px 55%;
	background-color: rgba(255, 255, 255, 0.7);
	margin: 0;
	width: 150px;
	font-size: 12px;
	z-index: 1;
	&::-ms-expand { display: none; }
	outline: none;
	float:right;
	display: grid;
	grid-template-areas: "select";
	align-items: left;
	position: relative;
	select, &::after {
		grid-area: select;
	}
	border: 1px solid var(--select-border);
	border-radius: 0.5em;
	padding: 4px 4px 4px 20px;
	cursor: pointer;
	line-height: 1.1;
	&:not(.select--multiple)::after {
		content: "";
		justify-self: end;
		width: 0.8em;
		height: 0.5em;
		background-color: var(--select-arrow);
		clip-path: polygon(100% 0%, 0 0%, 50% 100%);
	}
}
.langsel:focus + .focus {
	position: absolute;
	top: -10px;
	left: 0px;
	right: 0px;
	bottom: -10px;
	border: 2px solid var(--select-focus);
	border-radius: inherit;
}
.langsel[multiple] {
	padding-right: 0;
	height: 3rem;
	option {
		white-space: normal;
		outline-color: var(--select-focus);
	}
}
.langsel--disabled {
	cursor: not-allowed;
	background-color: #eee;
	background-image: linear-gradient(to top, #ddd, #eee 33%);
}
.langsel label {
	font-size: 1.125rem;
	font-weight: 500;
}
.langsel + label {
	margin-top: 2rem;
}

/* main movie */
#content-main {
	background: url("../img/cmn/frame_01.gif");
	background-repeat: no-repeat;
	float: left;
	width: 514px;
	height: 394px;
	margin-bottom:10px;
}
#contents {
	width: 480px;
	height: 360px;
	margin: 17px;
	overflow:hidden;
	display:block;
}
.cnt-top {
	background-image: url("../img/cmn/fmg_bg_02.png");
	background-color: #FFD7F2;
}

/* footer */
#footer {
	background-color: #ff82b2;
	width: 768px;
	height:100px;
	text-align: center;
	margin: auto 0px 0px;
	padding: 5px;
	display: block;
}
.footer_link_area {
	display: table;
	width: 100%;
	height: 50px;
	padding: 6px 0px;
}
.footer_link_area p {
	width: 33.3%;
	display: table-cell;
}
.area_l { text-align: left; }
.area_c { text-align: center; }
.area_r { text-align: right; }
.footer_logo {
	height: 37px;
	width: 60px;
	margin: 5px;
}
.footer_link {
	width: 48px;
	height: 48px;
}
.footer_link_area a {
	margin:0px 5px;
	display:inline-block;
}
.footer_text_area {
	font-size: 12px;
	color: #fff;
	line-height: 1.5;
	margin:0;
}
.footer_text_area a { margin:0px 8px; }
/* --- サウンドボタン --- */
#sound {
	background-color: transparent;
	border: none;
	float: left;
	width: 36px;
	height: 28px;
	margin: 365px 0px 0px;
}