@charset "utf-8";

#body {
    opacity: 0;
    background: url(/img/main-min.png) center center / cover no-repeat;
}

#no_design_main	{
	position: relative;
	padding: 0px 0;
	float:right;
}
#no_design_main:after	{
	content: "";
	display: block;
	position: relative;
	clear: both;
}
.main_visual_box {
    max-width: 1000px;
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 2%;
	height: 1000px;
}
.ban-basic .slides li img{
	width:100%; 
	height:100%;
	top: 0;
    left: 0;
    object-fit: cover;
    margin: auto;

}

.flex-viewport {
    height: 300px;
	}

.main_bt .info {
    max-width: 490px;
    width: 50%;
    min-height: 200px;
    float: left;
    display: inline-block;
}

.main_bt .banner {
    max-width: 490px;
    width: 50%;
    display: inline-block;
    min-height: 350px;
	margin-left: 20px;
}

.main_slide{margin-bottom:20px;}

.d_day{background-color:rgba(0,0,0,0.5);  text-align:center; font-size:1.2em; font-weight:600; margin-bottom:20px;  width:60px;  margin-left: 19px;
  }
 
.dday{width:10%;  margin-left:45%; min-width:100px;}
.dday img{width:250px;}
#main_visual_box	{ 
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    box-sizing: border-box;
    margin-top: -30px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

#main_visual_box img.hidden {
 opacity: 0;
 transform: translateY(10px);
}
#main_visual_box img {
 opacity: 1;
 transform: translateY(0);
 transition: all .8s ease-in-out 1s;
}

#main_copyright_box	{
	position: fixed;
    text-align: right;
    box-sizing: border-box;
    width: 100%;
    height: 11px;
    font-size: 11px;
    padding: 0;
    color: #999;
    bottom: 50px;
    padding-right: 70px;
}
#main_copyright_box	a{
    color: #999 !important;
}

	@media screen and (max-width:1300px)
{ .main_bt .banner{
	max-width:100%;
	width:100%;
	margin-left:0;}
	.main_bt .info{
	max-width:100%;
	width:100%;
	margin-left:0;}
	
	}
@media screen and (max-width:1000px)
{ 
	#main_visual_box{
	min-height: 0px;
	}
	#main_twitter_box	{
		width:32%;
	}
	#main_image_box	{
		margin-left: 2%;
	margin-right: 2%;
		width:32%;
	}
	#main_side_box	{
	width: 32%;
	}
	#main_bottom{
	left:0;
	}
	
}

.tooltip {
  position: relative;
  display: block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 200px;
  background-color: #6ba2c9;
  color: #eaeaea;
  border-radius: 6px;
  padding: 5px 0;
  margin-bottom:15px;
  bottom:30px;
  left:0px;
  position: absolute;
  z-index: 1;
  box-shadow:3px 3px 3px 3px rgba(0,0,0,0.2);
}
.tooltiptext:after{
    display: block; 
    content: ''; 
    position: absolute; 
    bottom: -6px; 
    left:96px; 
    width: 0px; 
    height: 0px; 
    border-bottom: 8px solid none; 
    border-left: 8px solid transparent; 
    border-right: 8px solid transparent; 
    border-top: 8px solid #6ba2c9;
  } 

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.banner_inner {
    position: absolute;
    width: 430px;
    height: 280px;
    overflow: auto;
}
div.tooltip2 {
	position: relative;
	display: inline-block;
	border-bottom: dotted 1px black;
}
div.tooltip2 span.tooltiptext2 {
	visibility: hidden;
	width: 120px;
	background-color: black;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	z-index: 1;
	transform: translate(-50%, -50%);
	bottom: 100%;
	left: 50%;
}

div.tooltip2 span.tooltiptext2::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: black transparent transparent transparent;
}

div.tooltip2:hover span.tooltiptext2 {
	visibility: visible;
}

#copybtn{text-align:center; margin-left:120px;}