
@charset "UTF-8";

/*
*
* Panels Custom
* --------------------------------------------------
*/
.panel {
	margin-bottom: 0;
	box-shadow: none;
	border: none;
	border-radius: 0;
}

.panel-custom {
	padding: 22px 0 20px;
}

@media (min-width: 768px) {
	.panel-custom {
		/*padding: 55px 0 55px 0;*/
		padding: 25px 0 25px 0;
	}
}

.panel-custom + .panel-custom {
	border-top: 1px solid #ececee;
	margin-top: 0;
}

.panel-custom .panel-custom-title > a {
	display: block;
	position: relative;
	padding-right: 40px;
	color: #333;
	background: transparent;
	transition: .3s all ease;
}

.panel-custom .panel-custom-title > a:before {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	font: 400 24px/24px "Linearicons";
	color: #2ed3ae;
	transform: translateY(-50%) rotate(0deg);
	transition: .35s all ease-in-out;
}

.panel-custom .panel-custom-title > a span {
	padding-left: 8px;
	color: #888;
	font-size: 14px;
}

.panel-custom .panel-custom-title > a.collapsed {
	background: #fff;
}

.panel-custom .panel-custom-title > a.collapsed:before {
	content: '\e936';
	transform: translateY(-50%) rotate(180deg);
}

.panel-custom .panel-custom-title > a:hover {
	text-decoration: none;
	background: transparent;
}

.panel-custom .panel-custom-collapse {
	background: transparent;
}

.panel-custom .panel-custom-collapse .panel-custom-body {
	padding: 15px 25px 30px 0;
}

@media (min-width: 768px) {
	.panel-custom .panel-custom-collapse .panel-custom-body {
		padding: 30px 30px 22px 0;
	}
}

h3 + .panel-custom-group-wrap {
	margin-top: 30px;
}

.panel-classic .panel-custom-title > a {
	padding-left: 35px;
	padding-right: 0;
}

.panel-classic .panel-custom-title > a:before {
	content: "\e93c";
	top: 47%;
	left: 0;
	right: auto;
	transform: translateY(-50%) rotate(90deg);
	transition: .35s all ease-in-out;
}

.panel-classic .panel-custom-title > a.collapsed:before {
	content: '\e93c';
	transform: translateY(-50%) rotate(0deg);
}

.panel-classic .panel-custom-title > a:hover {
	text-decoration: none;
	background: transparent;
}

/* add  */

@media screen and (max-width: 768px){
.osusumedisc{
	display: none;
}
}

/* old CSS */

.black_14{font-size: 110%;line-height: 20px;}
.black_15{font-size: 125%;line-height: 25px;}
.black_16{font-size: 140%;line-height: 25px;}
.black_20{font-size: 200%;line-height: 25px;}
.blacktext{color:black;}
.red{color:#FF0000;}
.red_bold{color:#FF0000;font-weight: 900;}
.b_14{font-size: 110%; font-weight: 900;}
.red14{color:#FF0000;font-size: 110%;}
.red11{color:#FF0000;font-size: 85%;}
.red14{color:#FF0000;font-size: 110%;}
.red15{color:#FF0000;font-size: 125%;}
.red16{color:#FF0000;font-size: 135%;}
.b_13{font-size: 100%; font-weight: 900;}
.b_14{font-size: 110%; font-weight: 900;}
.b_15{font-size: 130%; font-weight: 900;}
.b_13red{color:#FF0000;font-size: 100%;font-weight: 900;}
.b_14red{color:#FF0000;font-size: 115%; font-weight: 900;}
.b_15red{color:#FF0000;font-size: 130%; font-weight: 900;}
.sss{ font-size:80%;line-height:16px;}
.ss{ font-size:90%;line-height:16px;}
.ssgray{ font-size:90%;color:gray;line-height:25px;}
.ssgreen{ font-size:90%;color:green;line-height:25px;}
.orangetext{color:orange;}
/*.white{color:white;font-size:13px;}*/
.white{font-color:white;}
.white_ss{color:white; font-size:90%;line-height:18px;}
.green{color:green;}
.green_18{color:green;font-size: 180%;line-height: 25px;}
.pink_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #FFDFEF 0%) repeat scroll 0 0;}
.blue_line{background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #cce5ff 0%) repeat scroll 0 0;}
.yellow_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffffbc 0%) repeat scroll 0 0;}
.gray{color:gray;}


.box{border:solid 1px #B2D6FF;
margin:0.5em 0px 0px 0px;
padding:1em;
}

.box_hot{
border:solid 2px red;
margin:1.5em 1em 0em 1em;
padding:1em;
/* line-height:25px; */
}


.box_discount{
border:solid 2px lightgreen;
margin:1.5em 1em 0em 0em;
padding:1em;
/* line-height:25px; */
}



.topics {list-style-position:outside;
background-image:none;
		 list-style-type:disc;
		 margin: 0em 0em 0em 0.5em;
		 } 
		 
ul.topics li {
padding-left:0;
margin:0px 0px 1em 1em;
}

/* Google Map */
.GoogleMap {
	overflow: hidden;
	position: relative;
	margin:10px 0;
	height: 0;
	padding-bottom: 75%;
}
.GoogleMap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 97% !important;
	height: 97% !important;
}

.snow{
	background-color: #fffafa;
}

.offset-bottom-30{padding-bottom:30px;}

.offset-bottom-60{padding-bottom:60px;}

.formlabel{
	text-align:left;
	color:#201F1F;
	padding: 0px 0px 5px 5px;
}


/* header background  */


.toumeiblack {background-color: rgba(0, 0, 0, 0.2);
}




.bg-onkyo{
	background-image: url("../images/1902x674_top_circles.jpg");
		background-position: 50% 50%;
}


.bg-topnarrow{
	background-image: url("../images/1902x400_top_circles_narrow.jpg");
}

.bg-pa{
	background-image: url("../images/1200x800_hall_dark.jpg");
	background-position: 50% 70%;
}


.bg-interview{
	background-image: url("../images/1200x800_interview.jpg");
}



.questions{
	padding-left: 1.5em;
}


.taxinclude{
	font-size: 15px;
	/* font-weight: 100; */
	color: #2ed3ae;
}

.hidden{
	display: none;
}



.player{
    margin: 0px;
	width: 100%;
	margin-top: 5px;
}

.aritcles{
text-align: center;
	margin-top: 1em;
}

.aritclestext{
margin-top: 10px;
font-size: 1.1em;
}

.aritcles img{
  border-radius: 10%;  /* 円形にする */
}

.aritclelink{
font-size: 1em;
font-weight: 400;
}


.bigvideo {
  width: 100%;
  height: 90vh;
  position: relative;
}
 
.bigvideo video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
 
.content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
 
.content h1 {
  font-size: clamp(40px, 3.1915vw + 15.49px, 64px);
  color: #fff;
  text-align: center;
}
 
.content h1 span {
  display: block;
  line-height: 1.2;
  translate: 0 .5rem;
  opacity: 0;
  animation: fadein 1s forwards;
}
 
.content p {
  font-size: clamp(16px, 1.0638vw + 7.83px, 24px);
  color: #fff;
  text-align: center;
  line-height: 1.5;
  margin-top: 2rem;
  translate: 0 .5rem;
  opacity: 0;
  animation: fadein 1s forwards;
  animation-delay: .5s;
}
 
@keyframes fadein {
  to {
    translate: 0 0;
    opacity: 1;
  }
}
 
.bigvideo::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
}
 
main {
  height: 1000px;
  padding: 2rem;
  text-align: center;
}

.parallax-content h1{
	font-size: 2.5em;
	line-height: 1.6;
}


