@charset "utf-8";


/* =============================================================

	top

* ============================================================= */

#top-image {
	background-color: #FFD500;
	position: relative;
	padding-top: 37.5%;
	height: 280px;
	box-sizing: border-box;
	overflow: visible;
}

/*------ img ------*/

#ti-image > li > .img {
	position: absolute;
	z-index: 1;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	opacity: 0;
	-webkit-transform: translateX(40px);
	    -ms-transform: translateX(40px);
	        transform: translateX(40px);
}
html.IE8 #ti-image > li > .img {
	min-width: 640px;
}

#ti-image > li.active > .img {
	z-index: 3;
	-webkit-transform: translateX(0);
	    -ms-transform: translateX(0);
	        transform: translateX(0);
	opacity: 1;
	transition: opacity .6s, -webkit-transform .6s;
	transition: opacity .6s, transform .6s;
	transition-delay: .2s;
}

#ti-image > li.gone > .img {
	z-index: 2;
	-webkit-transform: translateX(0);
	    -ms-transform: translateX(0);
	        transform: translateX(0);
	opacity: 0;
	transition: opacity .7s;
}

#ti-image > li > .img > img {
	width: 100%;
	min-width: 640px;
	height: auto;
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
}
html.IE8 #ti-image > li > .img > img {
	left: 0;
}


/*------ illust ------*/

#ti-image > li > .illust {
	display: block;
	position: absolute;
	right: 55%;
	bottom: 10%;
	background: url(../images/top-image_sprite01.png) no-repeat;
	opacity: 0;
	-webkit-transform: translateY(-15px);
	    -ms-transform: translateY(-15px);
	        transform: translateY(-15px);
}
html.IE8 #ti-image > li > .illust {
	visibility: hidden;
}
#ti-image > li.active > .illust {
	opacity: 1;
	-webkit-transform: translateY(0);
	    -ms-transform: translateY(0);
	        transform: translateY(0);
	transition: opacity .2s, -webkit-transform .4s;
	transition: opacity .2s, transform .4s;
	transition-delay: 1.3s;
}
html.IE8 #ti-image > li.active > .illust {
	visibility: visible;
}
#ti-image > li.gone > .illust {
	opacity: 0;
	-webkit-transform: translateY(10px);
	    -ms-transform: translateY(10px);
	        transform: translateY(10px);
	transition: opacity .2s, -webkit-transform .4s;
	transition: opacity .2s, transform .4s;
}

#ti-image > li.scene1 > .illust {
	width: 117px;
	height: 164px;
	background-position: -300px 0;
}
#ti-image > li.scene2 > .illust {
	width: 160px;
	height: 187px;
	margin-right: -20px;
	background-position: -750px 0;
}
#ti-image > li.scene3 > .illust {
	width: 178px;
	height: 134px;
	margin-right: -30px;
	margin-bottom: 10px;
	background-position: -250px -250px;
}
#ti-image > li.scene4 > .illust {
	width: 162px;
	height: 146px;
	background-position: -750px -250px;
}
#ti-image > li.scene5 > .illust {
	width: 147px;
	height: 147px;
	margin-right: -30px;
	background-position: -300px -550px;
}
#ti-image > li.scene6 > .illust {
	width: 119px;
	height: 140px;
	background-position: -750px -550px;
}


/*------ mark ------*/

#ti-image > li > .mark {
	display: block;
	position: absolute;
	right: 55%;
	top: 14%;
	width: 90px;
	height: 90px;
	background: url(../images/top-image_sprite01.png) no-repeat;
	opacity: 0;
	-webkit-transform: rotateY(90deg) translateZ(10px);
	        transform: rotateY(90deg) translateZ(10px);
}
html.IE8 #ti-image > li > .mark {
	visibility: hidden;
}
#ti-image > li.active > .mark {
	opacity: 1;
	-webkit-transform: rotateY(0deg) translateZ(0);
	        transform: rotateY(0deg) translateZ(0);
	transition: opacity .1s, -webkit-transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity .1s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition-delay: .5s;
}
html.IE8 #ti-image > li.active > .mark {
	visibility: visible;
}
#ti-image > li.gone > .mark {
	opacity: 0;
	-webkit-transform: rotateY(0deg) translateZ(0);
	        transform: rotateY(0deg) translateZ(0);
	transition: opacity .3s, -webkit-transform .3s;
	transition: opacity .3s, transform .3s;
}

#ti-image > li.scene1 > .mark {
	background-position: 0 0;
}
#ti-image > li.scene2 > .mark {
	background-position: -450px 0;
}
#ti-image > li.scene3 > .mark {
	background-position: 0 -250px;
}
#ti-image > li.scene4 > .mark {
	background-position: -450px -250px;
}
#ti-image > li.scene5 > .mark {
	background-position: 0 -550px;
}
#ti-image > li.scene6 > .mark {
	background-position: -450px -550px;
}


/*------ txt ------*/

#ti-image > li > .txt {
	position: absolute;
	top: 14%;
	left: 20%;
	margin: 40px 0 0 -105px;
	opacity: 0;
	transition: opacity .3s;
}
#ti-image > li.scene1 > .txt,
#ti-image > li.scene3 > .txt { /* 4行 */
	margin-left: -89px;
}
#ti-image > li.scene2 > .txt { /* 3行 */
	margin-left: -58px;
}

#ti-image > li.active > .txt {
	opacity: 1;
	transition: opacity 0s;
}

#ti-image > li > .txt > span {
	text-indent: -9999px;
	display: block;
	float: right;
	margin-left: 20px;
	width: 22px;
	height: 0;
	margin-top: 1px;
	background: url(../images/top-image_sprite01.png) no-repeat;
	overflow: hidden;
	transition: height .4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	transition-delay: 1s;
}


#ti-image > li.active > .txt > span.txt1 {
	transition-delay: 1.5s;
}
#ti-image > li.active > .txt > span.txt2 {
	transition-delay: 1.8s;
}
#ti-image > li.active > .txt > span.txt3 {
	transition-delay: 2.1s;
}
#ti-image > li.active > .txt > span.txt4 {
	transition-delay: 2.4s;
}
#ti-image > li.active > .txt > span.txt5 {
	transition-delay: 2.7s;
}


/* ---------------------------------------
	min-width: 1180px
--------------------------------------- */

@media screen and (min-width: 1180px) {
	#ti-image > li > .txt > span {
		margin-left: 25px;
	}
}

/* ---------------------------------------
	min-width: 1299px
--------------------------------------- */

@media screen and (min-width: 1299px) {
	#ti-image > li > .txt > span {
		margin-left: 30px;
	}
}



/* scene1 4行 */
#ti-image > li.scene1 > .txt > span.txt1 {
	background-position: -226px 0;
}
#ti-image > li.scene1 > .txt > span.txt2 {
	background-position: -184px 0;
}
#ti-image > li.scene1 > .txt > span.txt3 {
	background-position: -142px 0;
}
#ti-image > li.scene1 > .txt > span.txt4 {
	background-position: -100px 0;
}

#ti-image > li.active.scene1 > .txt > span.txt1 {
	height: 136px;
}
#ti-image > li.active.scene1 > .txt > span.txt2 {
	height: 113px;
}
#ti-image > li.active.scene1 > .txt > span.txt3 {
	height: 136px;
}
#ti-image > li.active.scene1 > .txt > span.txt4 {
	height: 161px;
}


/* scene2 3行 */
#ti-image > li.scene2 > .txt > span.txt1 {
	background-position: -634px 0;
}
#ti-image > li.scene2 > .txt > span.txt2 {
	background-position: -592px 0;
}
#ti-image > li.scene2 > .txt > span.txt3 {
	background-position: -550px 0;
}

#ti-image > li.active.scene2 > .txt > span.txt1 {
	height: 209px;
}
#ti-image > li.active.scene2 > .txt > span.txt2 {
	height: 209px;
}
#ti-image > li.active.scene2 > .txt > span.txt3 {
	height: 184px;
}


/* scene3 4行 */
#ti-image > li.scene3 > .txt > span.txt1 {
	background-position: -226px -250px;
}
#ti-image > li.scene3 > .txt > span.txt2 {
	background-position: -184px -250px;
}
#ti-image > li.scene3 > .txt > span.txt3 {
	background-position: -142px -250px;
}
#ti-image > li.scene3 > .txt > span.txt4 {
	background-position: -100px -250px;
}

#ti-image > li.active.scene3 > .txt > span.txt1 {
	height: 161px;
}
#ti-image > li.active.scene3 > .txt > span.txt2 {
	height: 162px;
}
#ti-image > li.active.scene3 > .txt > span.txt3 {
	height: 185px;
}
#ti-image > li.active.scene3 > .txt > span.txt4 {
	height: 233px;
}


/* scene4 5行 */
#ti-image > li.scene4 > .txt > span.txt1 {
	background-position: -718px -250px;
}
#ti-image > li.scene4 > .txt > span.txt2 {
	background-position: -676px -250px;
}
#ti-image > li.scene4 > .txt > span.txt3 {
	background-position: -634px -250px;
}
#ti-image > li.scene4 > .txt > span.txt4 {
	background-position: -592px -250px;
}
#ti-image > li.scene4 > .txt > span.txt5 {
	background-position: -550px -250px;
}

#ti-image > li.active.scene4 > .txt > span.txt1 {
	height: 138px;
}
#ti-image > li.active.scene4 > .txt > span.txt2 {
	height: 138px;
}
#ti-image > li.active.scene4 > .txt > span.txt3 {
	height: 138px;
}
#ti-image > li.active.scene4 > .txt > span.txt4 {
	height: 161px;
}
#ti-image > li.active.scene4 > .txt > span.txt5 {
	height: 257px;
}


/* scene5 5行 */
#ti-image > li.scene5 > .txt > span.txt1 {
	background-position: -268px -550px;
}
#ti-image > li.scene5 > .txt > span.txt2 {
	background-position: -226px -550px;
}
#ti-image > li.scene5 > .txt > span.txt3 {
	background-position: -184px -550px;
}
#ti-image > li.scene5 > .txt > span.txt4 {
	background-position: -142px -550px;
}
#ti-image > li.scene5 > .txt > span.txt5 {
	background-position: -100px -550px;
}

#ti-image > li.active.scene5 > .txt > span.txt1 {
	height: 209px;
}
#ti-image > li.active.scene5 > .txt > span.txt2 {
	height: 209px;
}
#ti-image > li.active.scene5 > .txt > span.txt3 {
	height: 138px;
}
#ti-image > li.active.scene5 > .txt > span.txt4 {
	height: 138px;
}
#ti-image > li.active.scene5 > .txt > span.txt5 {
	height: 90px;
}


/* scene6 5行 */
#ti-image > li.scene6 > .txt > span.txt1 {
	background-position: -718px -550px;
}
#ti-image > li.scene6 > .txt > span.txt2 {
	background-position: -676px -550px;
}
#ti-image > li.scene6 > .txt > span.txt3 {
	background-position: -634px -550px;
}
#ti-image > li.scene6 > .txt > span.txt4 {
	background-position: -592px -550px;
}
#ti-image > li.scene6 > .txt > span.txt5 {
	background-position: -550px -550px;
}

#ti-image > li.active.scene6 > .txt > span.txt1 {
	height: 138px;
}
#ti-image > li.active.scene6 > .txt > span.txt2 {
	height: 90px;
}
#ti-image > li.active.scene6 > .txt > span.txt3 {
	height: 138px;
}
#ti-image > li.active.scene6 > .txt > span.txt4 {
	height: 185px;
}
#ti-image > li.active.scene6 > .txt > span.txt5 {
	height: 138px;
}



/*------ indicator ------*/

#ti-indicator {
	line-height: 0;
	position: absolute;
	top: 20px;
	left: 25px;
}

#ti-indicator > i {
	display: inline-block;
	vertical-align: middle;
	width: 8px;
	height: 8px;
	border-radius: 10px;
	margin-right: 15px;
	background-color: #fff;
	position: relative;
	transition: all .3s;
}

#ti-indicator > i.active {
	width: 10px;
	height: 10px;
	background-color: #1a1a1a;
	margin: -1px 14px 0 -1px;
}



/* .top-badge
--------------------------- */

.top-badge {
	padding: 0 5%;
	position: relative;
}

.top-badge > h2 {
	text-indent: -9999px;
	width: 320px;
	height: 320px;
	background: url(../images/sprite01.png) no-repeat 0 -100px;
	position: absolute;
	top: -80px;
	z-index: 1;
}


/* top-news
--------------------------- */

#top-news {
	background-color: #f2f2f2;
	position: relative;
    width: 100%;                /* 横幅を200pxに指定 */
    height: 200px;               /* 横幅を200pxに指定 */
    border: 1px solid #AFAFAF;      /* わかりやすくボーダーを引く */
    overflow-y: scroll;          /* 縦方向にスクロール可能にする */
}

#top-news .list-news {
	margin-left: 60px;
	min-height: 190px;
}

.tn-btn > a {
	color: #fff;
	font-size: 0.8em;
	font-weight: bold;
	line-height: 40px;
	text-align: center;
	display: block;
	width: 128px;
	height: 40px;
	padding: 2px 0 0 2px;
	border-radius:  0 0 0 5px;
	background-color: #57C3EA;
	position: absolute;
	right: 0;
	top: 0;
}

.tn-btn > a:hover {
	background-color: #1dace0;
}


/* top-event
--------------------------- */

#top-event > figure {
	text-align: center;
	margin: -20px 0;
}

#top-event > figure > img {
	width: 610px;
}

#top-event .grid-1of1 {
	width: 92%;
	margin: 0 auto;
	float: none;
}
#top-event .grid-1of2 {
	padding-left: 1.5%;
	padding-right: 1.5%;
}

#top-event li a {
	font-weight: bold;
	line-height: 1.4;
	display: block;
}

#top-event .grid-1of1 a {
	font-size: 1.333em;
	padding-left: 290px;
}
#top-event .grid-1of2 a {
	padding-left: 240px;
}

#top-event li img {
	display: inline-block;
	vertical-align: middle;
	max-width: none;
}

#top-event  .grid-1of1 img {
	width: 300px;
	margin-left: -300px;
}
#top-event .grid-1of2 img {
	width: 240px;
	margin-left: -240px;
}
#top-event .grid-1of3 img {
	width: 100%;
	max-width: 320px;
	display: block;
	margin: 0 auto 25px;
}

#top-event .box-fukidashi {
	display: inline-block;
	vertical-align: middle;
}

#top-event .grid-1of1 .box-fukidashi {
	padding: 30px;
	margin-left: 5%;
	width: 95%;
}
#top-event .grid-1of2 .box-fukidashi {
	margin-left: 10%;
	width: 90%;
}

#top-event li b {
	color: #929496;
	font-size: 0.867em;
	font-weight: normal;
	letter-spacing: 2px;
	line-height: 1.4;
	display: block;
	margin-bottom: .5em;
}
#top-event .grid-1of1 b {
	font-size: 0.65em;
}


/* top-menu
--------------------------- */

#top-menu {
	background-color: #FFD500;
	position: relative;
}

#top-menu:after {
	content: "";
	width: 1px;
	height: 100%;
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 50%;
}

#top-menu li > a {
	font-size: 0.933em;
	display: block;
	padding: 20px;
	margin: -20px;
}
#top-menu li > a:hover {
	background-color: #f2ca00;
}

#top-menu li img {
	display: block;
	margin: 0 auto 20px;
}


/* top-others
--------------------------- */

.to-labo {
	float: left;
	padding-right: 300px;
	margin-right: 5%;
}

.to-fb {
	float: right;
	width: 300px;
	margin-left: -300px;
}

.to-labo li > a {
	font-size: 0.867em;
	line-height: 1.7;
	display: block;
}

.to-labo li span {
	text-align: center;
	display: block;
	padding: 5px 0 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #ccc;
}

.to-labo li img {
	width: 210px;
}

.to-blog {
	margin: 50px 0 20px;
}

.to-blog > a {
	display: block;
	width: 640px;
	margin: 0 auto;
}


/* top-banner
--------------------------- */

#top-banner {
	background-color: #f2f2f2;
	margin-bottom: -50px;
	position: relative;
}

#top-banner h3 {
	text-align: center;
	background-color: #f2f2f2;
	position: absolute;
	top: -2em;
}

#top-banner ul {
	text-align: center;
}

#top-banner li {
	color: #4d4d4d;
	text-align: left;
	font-size: 0.867em;
	line-height: 1.6;
	width: 20%;
	padding: 0 10px;
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
}

#top-banner a {
	display: block;
}

#top-banner img {
	width: 100%;
	max-width: none;
	display: block;
	margin-bottom: 8px;
}



/* =============================================================

	news

* ============================================================= */

/* news-article
--------------------------- */

.na-header {
	margin-bottom: 50px;
}

.na-date {
	color: #999;
	font-size: 0.867em;
	line-height: 1.6;
	letter-spacing: 2px;
	text-align: center;
	margin-top: -10px;
}


/* news-list
--------------------------- */


#news-list .list-news {
	font-size: 1em;
	border-bottom: 1px solid #ccc;
}

#news-list dt {
	font-size: 0.933em;
	padding-top: 32px;
	padding-bottom: 30px;
}

#news-list dd > a {
	font-size: 1.067em;
	padding-top: 30px;
	padding-bottom: 30px;
}



/* =============================================================

	event

* ============================================================= */

/* event-summary
--------------------------- */

#event-summary p > a {
	text-decoration: underline;
}

.es-image {
	text-align: center;
	margin-bottom: 10px;
}

.es-caption {
	font-size: 0.867em;
	line-height: 1.6;
	text-align: center;
}

#event-summary h2 {
	margin: 50px auto 60px;
}

#event-summary .island-a {
	padding: 20px 30px;
	margin: 30px -10px 0;
}

.event-button .expire {
	color: #999;
	font-size: 1.067em;
	font-weight: bold;
	line-height: 70px;
	text-align: center;
	padding: 0 1em;
	min-width: 12em;
	display: block;
	background-color: #e5e5e5;
	border-radius: 5px;
	width: 400px;
	margin: 0 auto;
}


/* =============================================================

	staff

* ============================================================= */

/* staff-list
--------------------------- */

#staff-list section {
	margin-bottom: 30px;
}

#staff-list .box-fukidashi {
	display: block;
	position: relative;
	margin-left: 140px;
	padding-right: 70px;
}

#staff-list h3:after {
	content: "";
	width: 40px;
	height: 40px;
	background: url(../images/sprite01.png) no-repeat -350px -350px;
	position: absolute;
	top: 50%;
	right: 15px;
	margin-top: -20px;
}

#staff-list .position {
	font-size: 0.933em;
	font-weight: bold;
}

#staff-list p {
	line-height: 1.6;
}

#staff-list h3 {
	font-size: 1.2em;
	line-height: 1.4;
	text-align: left;
	margin: 5px 0 10px;
}

#staff-list h3 > span {
	font-size: 0.722em;
	display: inline-block;
}

#staff-list h3 > i {
	display: block;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	left: -140px;
	top: 50%;
	margin-top: -50px;
}


/* staffcnt-header
--------------------------- */

#staffcnt-header {
	max-width: 980px;
}

#staffcnt-header > div {
	min-height: 360px;
	position: relative;
	padding-left: 430px;
}

#staffcnt-header .box-fukidashi {
	margin-bottom: 30px;
	padding: 25px 30px;
}

#staffcnt-header h2 {
	text-align: justify; /* for ff, webkit */
	text-justify: inter-ideograph; /* for IE */
	margin-bottom: 10px;
}

#staffcnt-header h2 > img {
	position: absolute;
	left: -430px;
	top: 0;
	width: 360px;
}

#staffcnt-header header > p {
	font-size: 0.933em;
	font-weight: bold;
	line-height: 1.6;
}

#staffcnt-header header > p > b {
	font-size: 1.385em;
}

#staffcnt-header p > a {
	text-decoration: underline;
}


/* staffcnt-profile
--------------------------- */

.sp-dlist {
	margin-bottom: -30px;
}

.sp-dlist > dt {
	font-weight: bold;
	position: absolute;
	padding: 0 0 30px 50px;
}

.sp-dlist > dd {
	padding: 0 50px 30px 12em;
}

.sp-dlist > dd > a {
	text-decoration: underline;
}


/* =============================================================

	archive

* ============================================================= */

/* archive-nav
--------------------------- */

#archive-nav {
	background-color: #f2f2f2;
}

#archive-nav > .container {
	padding-top: 30px;
	padding-bottom: 30px;
}

#an-nav {
	max-width: 980px;
	margin: 0 auto;
}

#an-nav > li {
	width: 25%;
	float: left;
	position: relative;
	z-index: 1;
}

#an-nav > li > a {
	color: #fff;
	font-weight: bold;
	line-height: 60px;
	text-align: center;
	display: block;
	padding-left: 20px;
	background-color: #A6A8AB;
	border-left: 1px solid #fff;
position: relative;
}
#an-nav > li > a:hover {
	background-color: #808183;
}
#an-nav > li.active > a {
	background-color: #333;
}
#an-nav > li.btn1 > a {
	padding-left: 0;
	border-radius: 5px 0 0 5px;
}
#an-nav > li.btn4 > a {
	border-radius: 0 5px 5px 0;
}

#an-nav > li > a:before {
	content: "";
	width: 13px;
	height: 7px;
	background: url(../images/sprite01.png) no-repeat -350px -400px;
	position: absolute;
	top: 50%;
	left: 10%;
	display: block;
	margin: -2px 0 0 0;
}
#an-nav > li.btn1 > a:before {
	content: none;
}

#an-nav > li > a:after {
	content: "";
	border: 10px solid transparent;
	border-top-color: #A6A8AB;
	position: absolute;
	z-index: -1;
	bottom: -10px;
	left: 50%;
	margin-left: -10px;
	transition: bottom .3s;
}
#an-nav > li > a:hover:after {
	border-top-color: #808183;
}
#an-nav > li.active > a:after {
	border-top-color: #333;
}
#an-nav > li.open > a:after {
	bottom: -20px;
}
html.IE8 #an-nav > li.open > a:after {
	content: " ";
}

#an-nav > .btn1 {
	border: none;
}

#an-subnav-outer {
	height: 0;
	overflow: hidden;
	position: relative;
	transition: height .3s;
}

#archive-nav .box-fukidashi {
	width: 100%;
	padding: 5px;
	margin-top: 20px;
	position: absolute;
	z-index: 1;
	opacity: 0;
	visibility: hidden;
	transition: all .3s;
}
#archive-nav .box-fukidashi.open {
	z-index: 2;
	opacity: 1;
	visibility: visible;
}

#archive-nav .box-fukidashi:before,
#archive-nav .box-fukidashi:after {
	content: none;
}

.an-subnav-wrap {
	overflow: hidden;
}
.an-subnav {
	margin: 0 -1px -1px 0;
	overflow: hidden;
}
.an-subnav > li {
	float: left;
}
.an-subnav > li > a {
	color: #4d4d4d;
	font-weight: bold;
	text-align: center;
	display: block;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
	position: relative;
}
.an-subnav > li > a:hover {
	background-color: #f2f2f2;
}
.an-subnav > li.active > a {
	background-color: #fff2b2;
}

html.IE8 #archive-nav .box-fukidashi.open .an-subnav > li > a:before {
	content: " ";
}

.an-subnav.target > li {
	width: 25%;
}
.an-subnav.target > li > a {
	line-height: 72px;
}
.an-subnav.target > li > a:before {
	content: "";
	background: url(../images/sprite01.png) no-repeat;
	width: 40px;
	height: 40px;
	display: inline-block;
	vertical-align: middle;
	margin: 0 15px 2px 0;
}
.an-subnav.target > li.orange > a:before {
	background-position: -500px -100px;
}
.an-subnav.target > li.green > a:before {
	background-position: -550px -100px;
}
.an-subnav.target > li.blue > a:before {
	background-position: -600px -100px;
}
.an-subnav.target > li.pink > a:before {
	background-position: -650px -100px;
}


.an-subnav.year {
	margin-right: -2px;
}
.an-subnav.year > li {
	width: 16.667%;
}
.an-subnav.year > li > a {
	line-height: 54px;
}
.an-subnav.year > li > a:before {
	content: "";
	width: 10px;
	height: 10px;
	background-color: #FFD500;
	border-radius: 50%;
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px 2px 0;
}


.an-subnav.program > li {
	width: 50%;
}
.an-subnav.program > li > a {
	text-align: left;
	letter-spacing: 0;
	line-height: 54px;
	padding-left: 20px;
}


.an-subnav.program > li > a:before {
	content: "";
	background: url(../images/sprite01.png) no-repeat;
	display: inline-block;
	vertical-align: middle;
	width: 90px;
	margin-right: 15px;
}
.an-subnav.program > li.orange > a:before {
	height: 27px;
	background-position: 0 -450px;
}
.an-subnav.program > li.green > a:before {
	height: 24px;
	background-position: 0 -500px;
}
.an-subnav.program > li.blue > a:before {
	height: 22px;
	background-position: -100px -450px;
}
.an-subnav.program > li.pink > a:before {
	height: 21px;
	background-position: -200px -450px;
}
.an-subnav.program > li.purple > a:before {
	height: 23px;
	background-position: -100px -500px;
}


/* archive-list
--------------------------- */
#archive-list .list-archive {
	margin-bottom: -10px !important;
}


/* archivecnt-summary
--------------------------- */

#as-img-main {
	margin-bottom: 25px; /* 600 x 380 */
	padding-top: 63.333%;
	position: relative;
	overflow: hidden;
}

#as-img-main li {
	width: 100%;
	position: absolute;
	z-index: 1;
	top: 0;
	opacity: 0;
	transition: opacity .3s;
}
html.IE8 #as-img-main li {
	visibility: hidden;
}
#as-img-main li.active {
	opacity: 1;
	z-index: 2;
}
html.IE8 #as-img-main li.active {
	visibility: visible;
}

#as-img-main li img {
	width: 100%;
	height: auto;
}

#as-img-thum > li > span {
	display: block;
	padding-top: 63.333%;
	border: 3px solid transparent;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	transition: border-color .3s;
}
#as-img-thum > li.active > span {
	border-color: #FFD500;
}

#as-img-thum > li > span > img {
	position: absolute;
	top: 0;
	width: 100%;
}

#archivecnt-summary .island-b {
	padding: 30px;
	margin-bottom: 40px;
}

.as-caption {
	font-size: 0.867em;
	line-height: 1.6;
	margin: 15px 15px 0;
}


/* =============================================================

	program

* ============================================================= */

/* program-lead
--------------------------- */

#program-header {
	background-color: #FFD500;
	position: relative;
	margin-top: 180px;
	padding-top: 70px;
}

#program-header:before,
#program-header:after {
	content: "";
	background: url(../images/sprite01.png) no-repeat;
	position: absolute;
}
#program-header:before {
	width: 338px;
	height: 263px;
	background-position: -400px -750px;
	top: -190px;
	right: 50%;
	margin-right: 17%;
}
#program-header:after {
	width: 319px;
	height: 215px;
	background-position: -400px -1050px;
	top: -160px;
	left: 50%;
	margin-left: 19%;
}

#program-header h2 {
	text-indent: -9999px;
	width: 365px;
	height: 312px;
	background: url(../images/sprite01.png) no-repeat 0 -750px;
	position: absolute;
	left: 50%;
	top: -230px;
	margin-left: -182px;
}

#pl-list:after {
	content: "";
	width: 270px;
	height: 182px;
	background: url(../images/sprite01.png) no-repeat 0 -1100px;
	position: absolute;
	bottom: 100px;
	left: 50%;
	margin-left: -135px;
}

#pl-list {
	position: relative;
	margin-bottom: -60px;
}
#pl-list > li {
	font-size: 0.933em;
	width: 32%;
	background-color: #fff;
	border-radius: 10px;
	display: inline-block;
	vertical-align: top;
	margin-bottom: 60px;
	padding: 0 3% 20px;
	box-sizing: border-box;
}
#pl-list > li.orange {
	position: absolute;
	left: 34%;
	margin-top: 60px;
}
#pl-list > li.green,
#pl-list > li.pink {
	margin-right: 36%;
}

#pl-list .logo > b {
	text-indent: -9999px;
	display: block;
	margin: -35px auto 15px;
	width: 240px;
	background: url(../images/sprite01.png) no-repeat;
}

#pl-list .orange .logo > b {
	height: 80px;
	background-position: 0 -550px;
}
#pl-list .green .logo > b {
	height: 80px;
	background-position: -250px -550px;
}
#pl-list .blue .logo > b {
	height: 70px;
	background-position: -500px -550px;
}
#pl-list .blue .logo {
	padding: 5px 0;
}
#pl-list .pink .logo > b {
	height: 70px;
	background-position: 0 -650px;
}
#pl-list .pink .logo {
	padding: 5px 0;
}
#pl-list .purple .logo > b {
	height: 76px;
	background-position: -250px -650px;
}
#pl-list .pink .logo {
	padding: 2px 0;
}

#pl-list .target-icon {
	float: left;
	margin: 20px 0 0 -10px;
}

#pl-list .target-icon li {
	margin: 0 4px 0 0;
}

#pl-list .btn {
	float: right;
	margin: 20px -10px 0 0;
}

#pl-list .btn > a {
	color: #ccc;
	font-size: 0.857em;
	font-weight: bold;
	line-height: 40px;
	letter-spacing: 0;
	text-align: center;
	display: block;
	width: 8.5em;
	background-color: #333;
	border-radius: 5px;
}
#pl-list .btn > a:hover {
	background-color: #000;
}



/* program-detail
--------------------------- */

.pd-lead-A h3,
.pd-lead-B h3 {
	font-size: 1.2em;
}

.pd-lead-A p,
.pd-lead-B p {
	min-height: 150px;
	padding-right: 190px;
	position: relative;
	box-sizing: border-box;
}

.pd-lead-A p > .img,
.pd-lead-B p > .img {
	display: block;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
}

.pd-lead-A,
.pd-lead-B {
	position: relative;
	max-width: 980px;
	margin: 0 auto 40px;
}
.pd-lead-A {
	overflow: hidden;
}

.pd-lead-A:after {
	content: "";
	width: 1px;
	height: 100%;
	background-color: #ccc;
	position: absolute;
	top: 0;
	left: 50%;
}

.pd-lead-A section.bottom {
	border-top: 1px solid #ccc;
	padding-top: 30px;
	margin-top: 30px;
}

.pd-lead-A header > p {
 	color: #fff;
 	font-size: 0.933em;
 	line-height: 25px;
 	text-align: center;
 	width: 6em;
	background-color: #EF7A00;
	padding: 0;
	margin-bottom: 10px;
 	min-height: 0;
 	display: inline-block;
 	border-radius: 3px;
}

.pd-lead-A header {
	margin-bottom: 15px;
	padding-right: 150px;
	position: relative;
}

.pd-lead-A .target-icon {
	position: absolute;
	right: 0;
	top: 0;
}

.pd-lead-B > header {
	float: left;
	width: 28%;
	padding-right: 30px;
	box-sizing: border-box;
}

.pd-lead-B header:after {
	content: "";
	width: 1px;
	height: 100%;
	background-color: #ccc;
	position: absolute;
	left: 28%;
	top: 0;
}

.pd-lead-B h3 {
	margin-bottom: 10px;
}

.pd-lead-B > p {
	float: right;
	width: 72%;
	padding-left: 40px;
	min-height: 130px;
}

.pd-lead-B p > .img {
	top: -20px;
}


/* =============================================================

	vision

* ============================================================= */

.vision-img1 {
	display: block;
	margin: 0 auto 50px;
}

.vision-img2 {
	max-width: none;
	width: 100%;
}

#vision-start .vision-img1 {
	width: 497px;
}
#vision-vision .vision-img1 {
	width: 503px;
}
#vision-concept .vision-img1 {
	width: 506px;
}

#vision-concept {
	margin-bottom: -50px;
}


/* =============================================================

	notfound

* ============================================================= */

#notfound p {
	text-align: center;
}

#notfound img {
	width: 497px;
}