@charset "utf-8";
/* CSS Document */

#body{
	
	    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
	
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


ul{
	
	list-style: none;
}






/* img */

img{
	
	max-width: 100vw;
	
}


#top-img{
 position: relative;
 z-index: 0;
 padding: 0;
 width: 100%;
 height: 500px;
margin-bottom: 30px;
}


/* 体験版 */
#trial{
 position: absolute;
 z-index: 999;
 right: 2em;
 padding-top: 420px;
	
}

#title{
 position: absolute;
 z-index: 950;
left: -0.3vw;

}

/*枠*/
#waku{
	position: absolute;
    z-index: 900;

	
}




/* 幡 */
#hata{
 position: absolute;
 z-index: 1;
}
/* 亜雲 */
#agumo{
 position: absolute;
 z-index: 5;
}
/* 碓井 */
#usui{
 position: absolute;
 z-index: 10;
}

/* 情報 */
#info{
 position: absolute;
 z-index: 20;

}

/*背景透過*/
#bg{
	
	position: absolute;
	z-index: 0;
}



h2{
	margin-top: 5%;
	font-size: 20px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	color:##5B5B5B;
     font-weight: bold;
    text-shadow: 2px 2px 1px #FFFFFF,
    -2px 2px 1px #FFFFFF,
    2px -2px 1px #FFFFFF,
    -2px -2px 1px #FFFFFF;
	text-align: center;
	max-width: 100vw;

	
}

.newsbox{
    margin:auto; 
	height:20vh;
	width:40vw;
	border:double 3px #D7D7D7;
	overflow:auto;
	background-image:url(../img/bg_n.jpg);
	font-size: 12px;
	
}

.newsbox dl{
	line-height:1.6em;
	margin-left:20px;
}

.newsbox dt{
	font-weight: bold;
	color:#000;
    /*width: 60px;*/
}

.newsbox dd{
 margin: -1.6em 0 4px 0;
 padding: 0 0 4px 110px;
 border-bottom:dashed 1px #000000;
 }


#news,#story,#cha,#pro,#shop,#spe{
	margin-top:-60px;/*←ヘッダー分のジャンプ位置調整（ヘッダー+10してるよ）*/
    padding-top:60px;/*←ヘッダー分のジャンプ位置調整（ヘッダー+10してるよ）*/
}

.product{
	margin-top: 10em;
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom:solid;
	border-color: #b51c16;
}


.ans{
	line-height:1.8em;
	width: 50%;
    margin: 10px auto;
    max-width: 420px;
	font-size: 12px;
}

.twitter-timeline{
	
	margin-left: 30%;
}





.title {
    position: relative;
    color: #ffffff ;
    background: #000000;
    font-size: 16pt ;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    line-height: 1;
    margin: 10px -10px 20px -10px;
    padding: 10px 5px 10px 20px;
    box-shadow:1px 3px 7px 0px  #666666 ;
    border-top:3px solid #b51c16;
	text-align: center;
}
.ja{
	text-align: center;
}

.anc{
	margin: 20px;	
	text-align: center;
}

.title:after, title:before {
    content: "";
    position: absolute;
    top: 100%;
    height: 0;
    width: 0;
    border: 5px solid transparent;
    border-top: 5px solid #333;
}
.title:after {
    left: 0;
    border-right: 5px solid #333;
}
.title:before {
    right: 0;
    border-left: 5px solid #333;
}