@charset "utf-8";


/*----------------------------------------------------*/ 
/* carousel
------------------------------------------------------*/ 

#top_vi {
	margin:0 auto;
	margin-bottom:0px;
	position:relative;
	width:1280px;
}

#top_vi .carousel li {
	overflow: hidden;
	float:left;
	position:relative;
}

#top_vi .carousel li img {
	width:100%;
	height:auto;
}

#top_vi .carousel li .title {
	color:#FFF;
	font-size:165%;
	position:absolute;
	left:15%;
	top:40%;
	text-shadow: 0 0 8px #000;
}

#top_vi .carousel li .title.pc_displayNone {
	display: none;
}

#top_vi .carousel li .leadTitle {
	position:absolute;
	left:13%;
	color:#333;
	letter-spacing:.1em;
	margin-top:42px;
}

#top_vi .carousel li .leadTitle dt {
	font-size:186%;
	line-height:1.5;
	font-family: "I-OTF-UDゴ表示Pro M";
}

#top_vi .carousel li .leadTitle dd {
	font-weight:500;
	font-size:165%;
	line-height:1.5;
	font-family: "I-OTF-UDゴ表示Pro M";
}

#top_vi .carousel li .external_link {
	position:absolute;
	right:52%;
	top: 91%;
	color:#333;
	font: 12px 'IwaUDGoHonPro-Th';
}

#top_vi .carousel li .external_link:after {
	content: '';
	display: inline-block;
	width: 12px;
	height: 12px;
	background-image: url(/lib/image/cmn/icon_external_link.png);
	background-size: contain;
	vertical-align: middle;
	margin-left: 10px;
}

@media screen and (max-width: 767px) {
	#top_vi .carousel li .external_link {
		left:auto;
		right: 10%;
		letter-spacing: -.02em;
	}
}

#top_vi .dots {
	text-align:center;
	width:100%;
	margin-top:15px;
}

#top_vi .slick-dots {
	height:11px;
}

#top_vi .slick-dots li,
#top_vi .slick-dots li button,
#top_vi .slick-dots li button:before {
	width:11px;
	height:11px;
}

#top_vi .slick-dots li {	margin:0 7px;}
#top_vi .slick-dots li button:before {
	background:url(/lib/image/cmn/icon_csl-pager.png) no-repeat;
}
#top_vi .slick-dots li.slick-active button:before {
	background-image:url(/lib/image/cmn/icon_csl-pager-on.png);
}

@media only screen and (max-width: 1280px) {

	#top_vi {
		width:auto;
	}

	#top_vi img {width:100%;}
}


#top_vi .inVideo01 {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1280 / 300;
}

#top_vi .inVideo01 video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	transform: translate(-50%,-50%);
}
@media only screen and (min-width: 768px) {
	#top_vi .inVideo01 #topmv_sp {
		display: none !important;
	}
}
@media only screen and (max-width: 767px) {
	#top_vi .inVideo01 {
		aspect-ratio: 750 / 440;
	}
	#top_vi .inVideo01 #topmv_pc {
		display: none !important;
	}
}



#top_vi .movieModalBtn01 {
	overflow: hidden;
	position: relative;
}
#top_vi .movieModalBtn01 .isbtn {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	text-align: center;
	transform: translateY(-50%);
	z-index: 5;
}
#top_vi .movieModalBtn01 .isbtn img {
	width: 150px;
	margin: 0 auto;
}
#top_vi .movieModalBtn01 .isbg,
#top_vi .movieModalBtn01 .isbg img {
	opacity: 0;
}

#top_vi .movieModalBtn01 .inVideo {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60%;
	height: 145%;
	transform: translate(-50%,-50%);
	background-color: #000;
	z-index: 2;
}
#top_vi .movieModalBtn01 .inVideo video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
}


@media only screen and (max-width: 767px) {

	#top_vi .carousel li .title {
		font-size:21px;
		width:100%;
		left:0;
		top:15px;
		text-align:center;
	}

	/* #top_vi .carousel li .leadTitle {
		width:100%;
		padding:10px 20px;
		box-sizing:border-box;
		background:#407EC9;
		color:#FFF;
		bottom: 25%;
		left:0;
		margin:0 0 -25px;
	} */
	#top_vi .carousel li .leadTitle {
		width:100%;
		padding:10px 10px;
		box-sizing:border-box;
		color:#000;
		top: 3%;
		left:0;
		margin:0 0 -25px;
		font-weight: 500;
		text-align: center;
	}

	#top_vi .carousel li .leadTitle dt {
		font-size:16px !important;
	}

	#top_vi .carousel li .leadTitle dd {
		font-size:16px !important;
	}

	.sp_displayNone{
		display: none;
	}
	#top_vi .carousel li .title.pc_displayNone {
		display: block;
		color:#1e0000;
		font-size:165%;
		text-shadow:none;
	}
	#top_vi .movieModalBtn01 .isbtn img {
		width: 20%;
	}
	#top_vi .movieModalBtn01 .inVideo {
		width: 140%;
		height: 240%;
	}
}



/* carousel01 */
#top_vi .carousel01__bg {
	position: relative;
	z-index: 1;
}

#top_vi .is-animetext01 {
	position: absolute;
	left: calc(260 / 1280 * 100%);
	z-index: 2;
	line-height: 0;
}

#top_vi .carousel01__title01 {
	top: 50%;
	width: calc(433 / 1280 * 100%);
	transform: translateY(-50%);
	opacity: 0;
}

#top_vi .carousel01__text {
	top: 100%;
	width: calc(471 / 1280 * 100%);
	transform: translateY(0);
}

#top_vi .carousel01__title02 {
	top: 100%;
	transform: translateY(0);
	width: calc(433 / 1280 * 100%);
}

@media only screen and (max-width: 767px) {
	#top_vi .is-animetext01 {
		left: calc(45 / 750 * 100%);
	}

	#top_vi .carousel01__title01 {
		width: calc(490 / 750 * 100%);
		transform: translateY(-60%);
	}

	#top_vi .carousel01__text {
		width: calc(660 / 750 * 100%);
	}

	#top_vi .carousel01__title02 {
		width: calc(650 / 750 * 100%);
		margin-bottom: calc(35 / 750 * 100%);
	}
}


/* carousel01 anime */
#top_vi .is-start .carousel01__title01 {
	animation: carousel01__title01 4.5s 1s forwards;
}

@keyframes carousel01__title01 {
	0% {
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	60% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

#top_vi .is-start .carousel01__text {
	top: 0;
	transform: translateY(-100%);
	opacity: 0;
	transition: top 31s 5.5s linear, transform 31s 5.5s linear, opacity 4s 32s;
}

#top_vi .is-start .carousel01__title02 {
	top: 50%;
	transform: translateY(-50%);
	transition: top 6s 28s linear, transform 6s 28s linear, opacity 4s 37s;
}

@media only screen and (max-width: 767px) {
	#top_vi .is-start .carousel01__title02 {
		top: 100%;
		transform: translateY(-200%);
		transition: top 2s 29s linear, transform 2s 29s linear, opacity 4s 37s;
	}
}


/*----------------------------------------------------*/ 
/* MessageFromOtsuka
------------------------------------------------------*/ 

#contents .MessageFromOtsuka {
	margin:0 0 20px;
	font-family: 'メイリオ', 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','ＭＳ Ｐゴシック',Helvetica,Arial,sans-serif;
}

#contents .MessageFromOtsuka p {
	border:1px solid #D7D7D7;
	padding: 2px 2px 4px 2px;
	background:#F7F7F7;
	font-size:115%;
	text-align:center;
	color:#666;
	margin-bottom:10px;
}


/*----------------------------------------------------*/ 
/* panel
------------------------------------------------------*/ 

#contents .panel {
	margin:0 -10px;
	overflow:hidden;
}

#contents .panel li {
	box-sizing:border-box;
	float:left;
	margin-bottom:20px;
	padding:0 10px 0 10px;
	text-align:center;
	width:25%;
}

#contents .panel li img {
	max-width:100%;
	height: auto;
}

#contents .panel li:nth-child(4n) {
	margin-bottom:20px;
	padding:0 ;
}

@media only screen and (max-width: 767px) {

	#contents .panel {
		margin:0 -5px 15px -5px;
	}

	#contents .panel li,
	#contents .panel li:nth-child(4n) {
		width:50%;
		padding:0 5px;
		margin-bottom:10px;
	}
	#contents .panel li img {
		width: 100%;
	}

}


/*----------------------------------------------------*/ 
/* newsrelease
------------------------------------------------------*/ 

#contents .newsrelease {
	background:#F7F7F7;
	padding:20px;
	margin-bottom:30px;
	position:relative;
}

#contents .newsrelease h2 {
	color:#666;
	font-size:108%;
	font-weight:normal;
	margin-bottom:15px;
}

#contents .newsrelease p.newsrelease_indexLink {
	margin-top:-2.5em;
	text-align:right;
}

#contents .newsrelease li {
	border-bottom:1px dashed #CCC;
	font-size:86%;
	margin-bottom:5px;
	padding:0 0 4px 0;
	text-indent:0;
}

#contents .newsrelease li:before {
	content:"・";
}

@media only screen and (max-width: 767px) {
	#contents .newsrelease p.newsrelease_indexLink {
		margin-top:-1em;
	}
}

/*----------------------------------------------------*/ 
/* information
------------------------------------------------------*/ 

#contents .information {
	background:#F7F7F7;
	padding:20px;
	margin-bottom:30px;
	position:relative;
}

#contents .information h2 {
	color:#666;
	font-size:108%;
	font-weight:normal;
	margin-bottom:15px;
}

#contents .information .infomation_box {
	overflow-y:auto;
	max-height:13.2em;

}

#contents .information li {
	border-bottom:1px dashed #CCC;
	font-size:86%;
	margin-bottom:5px;
	padding:0 0 4px 1em;
	text-indent:-2em;
}

#contents .information li:before {
	content:"　";
}

@media only screen and (max-width: 767px) {

	#contents .information .infomation_box {
		overflow:auto;
		overflow-x:hidden;
		height:auto;
	}

	#contents .information .moreRead {
		display:none;
	}
}

/*----------------------------------------------------*/ 
/* linkBanner
------------------------------------------------------*/ 
#contents .linkBanner {
	background:#F7F7F7;
	padding:20px;
	margin-bottom:30px;
	position:relative;
}

#contents .linkBanner h2 {
	color:#666;
	font-size:108%;
	font-weight:normal;
	margin-bottom:15px;
}

#contents .linkBanner .linkBanner_list {
	width:1000px;
	overflow:hidden;
}

#contents .linkBanner .linkBanner_list:last-child {
	margin-bottom:0;
}

#contents .linkBanner .linkBanner_list li {
	width:180px;
	margin:0 20px 10px 0;
	float:left;
}
#contents .linkBanner .linkBanner_list li a {
	display:block;
	margin-top:10px;
}
#contents .linkBanner .linkBanner_list li a:first-child {
	margin-top:0;
}

@media only screen and (max-width: 767px) {

	#contents .linkBanner {
		padding:0 20px;
	}

	#contents .linkBanner .moreLink a {
		display:block;
		box-sizing:border-box;
		padding:1em;
		margin:0 -20px;
		text-align:left;
		color:#333;
		clear:both;
		text-decoration:none !important;
		background:url(/lib/image/cmn/icon_acc-plus.png) no-repeat right 10px center;
	}

	#contents .linkBanner .moreLink a.close {
		background:url(/lib/image/cmn/icon_acc-minus.png) no-repeat right 10px center;
	}
	
	#contents .linkBanner .moreLink a:after,
	#contents .linkBanner .moreLink a.close:before {
		display:none;
	}

	#contents .linkBanner .linkBanner_list {
		width:100%;
	}

	#contents .linkBanner .linkBanner_list li {
		text-align:center;
		width:100%;
		margin:0 0 10px;
	}

}

#contents .snsArea {
	min-height: 21px;
}