.pc_menu_base .history.header_list {
	background:#FFF;
}
header .pc_menu_base .history.header_list .qtext {
	color:#90BA22;
}
.history.header_list a:hover .qtext {
	color:#FFFFFF!important;
}
.history .history_wrap{
	max-width:1280px;
	width:100%;
	height:auto;
	margin:100px auto 0;
}
.history .main {
	background:url(../images/history/main_bg.jpg) repeat left top;
}
.history .main_bg {
	background:url(../images/history/history_bg_3.png) repeat-y center top;
	margin:100px auto 0;
}
.history h1,
.history h2,
.history .birthday {
	font-family: 'quicksandbold';
}
.pc_text {
	display:block;
}
.sp_text {
	display:none;
}
.history .left_side {
	margin-top:75px;
	position:absolute;
	left:0;
	bottom:0;
}
.history .right_side {
	float:right;
	width:325px;
}
.history h2 {
	font-size:36px;
	color:#FFFFFF;
	background:url(../images/history/h2_bg.png) no-repeat left top;
	width:89px;
	height:47px;
	margin:0 auto;
	position:absolute;
	left:44%;
	z-index:2;
	padding-left:7px;
	display:none;
}
.history .center {
	width:740px;
	margin:0 auto;
	padding-bottom:55px;
}
.top h1 {
	letter-spacing:-0.08em;
	width:575px;
	margin:0 auto;
	padding-top:50px;
	font-size:60px;
	color:#FFFFFF;
	margin-bottom:20px;
    animation: textshow 1s ease-in forwards;
    -webkit-animation: textshow 1s ease-in forwards;
}
.history .top .t_text {
	width:400px;
}
.history .top p {
	max-width:500px;
	text-align:center;
	margin:0 auto;
	color:#FFFFFF;
	line-height:1.8;
	font-weight:bold;
	font-size:18px;
    animation: textshow2 1s ease-in forwards;
    -webkit-animation: textshow2 1s ease-in forwards;
}
.history .tree {
	background:url(../images/history/main_bg.jpg) repeat left top;
	margin-top:35px;
	width:740px;
	margin:35px auto 0;
}
.history .year_wrap {
	width:740px;
	margin:0 auto;
	padding-bottom:80px;
	overflow:hidden;
	background:url(../images/history/tree_bg.jpg) repeat-y center top;
	position:relative;
}
.history .year_wrap li {
	width:325px;
	position:relative;
	display:block;
}
.history .year.odd li {
	margin-top:50px;
}
.history .circle {
	background:url(../images/history/green_circle.png) no-repeat;
	width:24px;
	height:24px;
	position:absolute;
}
.history .left_side .circle {
	left:358px;
	bottom:70px;
}
.history .right_side .circle {
	right:383px;
	bottom:70px;
}
.history .blank {
	background:none !important;
}
/*.history header li img {
	margin:0;
}*/
.history .main li img {
	max-width:240px;
	max-height:160px;
	margin:0 auto;
}
.history li.even .circle {
	top:140px;
	left:383px;
}
.history li.odd .circle {
	top:140px;
	left:-56px;
}
.history .year_wrap .left_side li {
	padding:25px 0 25px;
	width:324px;
	height:300px;
	opacity:0;
	filter: alpha(opacity=100);
}
.history .year_wrap .left_side li.show {
    animation: listShow 0.8s forwards;
    -webkit-animation: listShow 0.8s forwards;
}
.history .year_wrap .right_side	li.show {
    animation: listShow 0.8s forwards;
    -webkit-animation: listShow 0.8s forwards;
}
.history .year_wrap .left_side li > div{
	width:275px;
	height:276px;
	margin:0 auto;
	padding:25px 25px 0 25px;
	background:url(../images/history/frame_left.jpg) no-repeat;
}
.history .year_wrap .left_side .single {
	height:125px;
	width:325px;
	padding:25px 0;
	background:none;
}
.history .year_wrap .left_side .single div {
	background:url(../images/history/frame_left_single.jpg) no-repeat;
	padding:25px 0 0 30px;
	height:100px;
	width:294px;
}
.history .year_wrap .right_side	li {
	padding:25px 25px 25px 0;
	width:324px;
	height:300px;
	opacity:0;
	filter: alpha(opacity=100);
}
.history .year_wrap .right_side li > div {
	width:300px;
	margin:0 auto;
	padding-left:25px;
	padding:25px 0 0 50px;
	background:url(../images/history/frame_right.jpg) no-repeat;
	height:275px;
}
.history .year_wrap .right_side .single {
	background:none;
	height:125px;
	width:325px;
	padding:25px 25px 25px 0;
}
.history .year_wrap .right_side .single div {
	background:url(../images/history/frame_right_single.jpg) no-repeat;
	width:275px;
	height:100px;
	padding:25px 0 0px 50px;
}
.history .year_wrap p {
	font-size:18px;
	color:#666666;
	line-height:1.4;
	width:258px;
	overflow:hidden;
	height:74px;
	margin-top:15px;
	word-break: break-all;
}
.history .single p {
	margin-top:0;
}
.history .year_wrap p a {
	color:#666666;
	text-decoration:underline;
}
.history .year_wrap p a:hover {
	text-decoration:none;
}
.history .frame_right p{
	margin-left:45px;
	margin-top:15px;
}
.history .left_side .year_break {
	position:absolute;
	right:-82px;
}
.history .right_side .year_break {
	position:absolute;
	left:-82px;
}
.history .year_2018 {
	top:114px;
}
.history .year_2017 {
	top:290px;
}
.history .year_2016 {
	top:290px;
}
.history .year_2014 {
	top:210px;
}
.history .year_2013 {
	top:114px;
}
.history .year_2012 {
	top:290px;
}
.history .year_2011 {
	top:210px;
}
.history .year_2010 {
	top:288px;
}
.history .year_2009 {
	top:297px;
}
.history .year_2008 {
	top:296px;
}
.history .year_2007 {
	top:120px;
}
.history .year_2006 {
	top:205px;
}
.history .year_2004 {
	top:295px;
}
.history .year_2003 {
	top:290px;
}
.history .year_2002 {
	top:295px;
}
.history .year_2001 {
	top:296px;
}
.history .year_2000 {
	top:295px;
}
.history .year_1999 {
	top:113px;
}
.history .year_1998 {
	top:338px;
}
.history .year_1997 {
	top:113px;
}

.history .now {
	background:url(../images/history/now_bg.jpg) no-repeat;
	width:741px;
	height:194px;
	margin:0 auto;
}
.history .born {
	background:url(../images/history/born_bg.jpg) no-repeat;
	width:718px;
	height:210px;
	margin:0 auto;
}
.history .top h3 {
	max-width:480px;
	margin:0 auto;
	padding:10% 0 5%;
}
.history .birthday {
	font-size:48px;
}
.history .bottom {
	text-align:center;
	color:#FFFFFF;
	margin-top:45px;
}
.history .birth_text {
	font-size:18px;
	line-height:1.8;
	margin-top:25px;
	font-weight:bold;
}
.history .capture {
	display:table-cell;
	vertical-align:middle;
	width:250px;
	height:160px;
}
@media only screen and (max-width :767px) {
	.pc_text {
		display:none;
	}
	.sp_text {
		display:block;
		width:280px;
		margin:0 auto;
	}
	.history .main_bg {
		background:url(../images/history/history_bg_sp.png) repeat-y center 106px;
	}
	.history .now {
		background:url(../images/history/now_bg_sp.png) no-repeat top center;
		height:162px;
		width:181px;
		margin-left:98px;
	}
	.history .year_wrap {
		background:url(../images/history/tree_bg_sp.jpg) repeat-y center top;
		width:280px;
		padding-top:30px;
		padding-bottom:0;
	}
	.history .tree {
		background:none;
		width:280px;
		margin-top:21px;
	}
	.history .born {
		background:url(../images/history/born_bg_sp.png) no-repeat;
		width:276px;
		height:152px;
	}
	.top h1 {
		font-size:36px;
		padding-top:31px;
		width:162px;
		letter-spacing:-0.08em;
		margin-bottom:14px;
	}
	.history .top p {
		font-size:15px;
		line-height:1.8;
		width:278px;
		margin:0 auto;
		font-weight:normal;
	}
	.history .center {
		width:auto;
		padding-bottom:21px;
	}
	.history .center li {
		background:url(../images/history/frame_sp.png) no-repeat left top;
		width:245px;
		height:259px;
		padding:21px 18px 0;
		margin-bottom:20px;
	}
	.history .center .single {
		background:url(../images/history/frame_single_sp.png) no-repeat left top;
		padding:16px 18px 0;
		width:245px;
		height:94px;
	}
	.history .year_wrap p {
		margin-top:8px;
	}
	.history .single p {
		margin-top:0;
	}
	.history .capture {
		margin-bottom:8px;
	}
	.history .year_break {
		margin:-5px auto 15px;
	}
	.history .birthday {
		font-size:36px;
		letter-spacing:-0.08em;
	}
	.history .birth_text {
		font-weight:normal;
		width:280px;
		margin:11px auto 0;
		font-size:15px;
	}
	.history .bottom {
		margin-top:18px;
		margin-bottom:30px;
	}
}
@media only screen and (max-width :480px) {
	.history .main_bg {
		margin-top:50px;
	}
}


/*animation*/
@keyframes textshow {
  0% {
    opacity: 0;
   }
  50% {
    opacity: 1;
   }
  100% {
    opacity: 1;
   }
}
@-webkit-keyframes textshow {
  0% {
    opacity: 0;
   }
  50% {
    opacity: 1;
   }
  100% {
    opacity: 1;
   }
}
@keyframes textshow2 {
  0% {
    opacity: 0;
   }
  50% {
    opacity: 0;
   }
  100% {
    opacity: 1;
   }
}
@-webkit-keyframes textshow2 {
  0% {
    opacity: 0;
   }
  50% {
    opacity: 0;
   }
  100% {
    opacity: 1;
   }
}
@keyframes listShow {
  0% {
    opacity: 0;
    top:100px;
   }
  100% {
    opacity: 1;
    top:0;
   }
}
@-webkit-keyframes listShow {
  0% {
    opacity: 0;
    top:100px;
   }
  100% {
    opacity: 1;
    top:0;
   }
}