@charset "utf-8";

/**
 *
 *  Zenlogicトップページ
 *
 */

/*--------------------------------------------------------------------------
   overwrite
---------------------------------------------------------------------------*/



/*--------------------------------------------------------------------------
	#mv-slider（スライダー）
---------------------------------------------------------------------------*/

#mv-slider{
	background:#FFF;
	height:600px;
	margin:0;
	padding:0;
	overflow:hidden;
	position:relative;
	border-bottom:1px solid #D3D5D9;
}
#mv-slider div {
	display:block;
}

.mv01,.mv02{
	background:#1D4BAD url(/images/index/main01.jpg) repeat-y center top;
	height:600px;
	overflow:hidden;
}
.mv01 .inner,
.mv02 .inner{
	width:960px;
	margin:0 auto;
	position:relative;
}

/* .mv01
--------------------------------------------------*/
.mv01 .txt-box{
	text-align:center;
}
.mv01 .txt-box h2{
	padding:45px 0 0;
	text-align:center;
	font-size:32px;
	font-size:3.2rem;
	font-weight:normal;
	letter-spacing:-0.005em;
}
.mv01 .txt-box h2 a{
	color:#FFF;
	text-decoration:none;
	transition:color 0.1s linear;
}
.mv01 .txt-box h2 a:hover{
	color:#CCD9EE;
}
.mv01 .txt-box h2 span{
	font-size:52px;
	font-size:5.2rem;
	line-height:1.0;
	letter-spacing:-0.01em;
	display:block;
}
.mv01 .txt-box h2 img{
	margin:8px auto 0;
}
.mv01 .txt-box p{
	color:#FFF;
	font-size:12px;
	font-size:1.2rem;
	line-height:1;
	position:absolute;
}
.mv01 .txt-box p.txt01{
	left:260px;
	top:275px;
}
.mv01 .txt-box p.txt02{
	left:380px;
	top:282px;
}
.mv01 .txt-box p.txt03{
	left:570px;
	top:275px;
}
.mv01 .txt-box p.txt04{
	left:290px;
	top:320px;
}
.mv01 .txt-box p.txt05{
	left:480px;
	top:320px;
}
.mv01 .txt-box p > span{
	vertical-align:bottom;
	display:inline-block;
}
.mv01 .txt-box p.txt01 span,
.mv01 .txt-box p.txt03 span{
	margin-bottom:-7px;
	padding-left:2px;
	font-size:35px;
	font-size:3.5rem;
}
.mv01 .txt-box p.txt02 span{
	margin-bottom:-4px;
	padding:0 3px;
	font-size:25px;
	font-size:2.5rem;
	letter-spacing:-0.005em;
}
.mv01 .txt-box p.txt01 span+span,
.mv01 .txt-box p.txt02 span+span,
.mv01 .txt-box p.txt03 span+span{
	margin-bottom:-2px;
	padding-left:1px;
	font-size:20px;
	font-size:2.0rem;
}
.mv01 .txt-box p.txt02 span+span+span{
	font-size:13px;
	font-size:1.3rem;
}
.mv01 .txt-box p.txt04 span,
.mv01 .txt-box p.txt05 span{
	padding-left:7px;
	font-size:13px;
	font-size:1.3rem;
}


/* .mv02
--------------------------------------------------*/
.mv02{
	background:#F5F9FC url(/images/index/main02.jpg) repeat-y center top;
}
.mv02 .txt-box{
	text-align:center;
}
.mv02 .txt-box h2{
	padding:70px 0 10px;
	font-size:30px;
	font-size:3.0rem;
	color:#538CD8;
	font-weight:normal;
}
.mv02 .txt-box h2 span{
	font-size:35px;
	font-size:3.5rem;
}
.mv02 .txt-box h2 img{
	display:inline-block;
	padding:17px 20px 0;
}
.mv02 .txt-box p.txt01{
	padding:0 0 20px;
	text-align:center;
	font-size:25px;
	font-size:2.5rem;
	line-height:1.4;
}
.mv02 .txt-box p.txt01 img{
	display:inline-block;
	padding-right:5px;
	margin-top:-5px;
}
.mv02 .txt-box p.txt01 span{
	margin-top:-10px;
	font-size:75px;
	font-size:7.5rem;
	display:inline-block;
}
.mv02 .txt-box p.txt01 span + span{
	font-size:55px;
	font-size:5.5rem;
}
.mv02 .txt-box p.txt01 span + span + span{
	font-size:65px;
	font-size:6.5rem;
}
.mv02 .txt-box .btn-border{
	margin:0 auto;
}
.mv02 .txt-box .btn-border a{
	padding:6px 0 4px;
	font-size:20px;
	font-size:2.0rem;
	color:#004381;
	border-color:#004381;
}
.mv02 .txt-box .btn-border a:before{
	background-image:url(/shared/images/ico_arw02.png);
	padding-right:15px;
}


/* .btn-order
--------------------------------------------------*/
#mv-slider .btn-order{
	position:static;
	margin:85px 0 0;
	position:relative;
}
#mv-slider .btn-order a{
	width:320px;
	padding:15px 0;
	font-size:20px;
	font-size:2.0rem;
	transition:background-color 0.15s linear;
	transition:box-shadow 0.4s linear;
}
#mv-slider .btn-order a span{
	margin:0;
	font-size:14px;
	font-size:1.4rem;
	color:#FFF;
	font-weight:normal;
	display:inline-block;
}
#mv-slider .btn-order a span span{
	font-size:22px;
	font-size:2.2rem;
	display:inline-block;
}
#mv-slider .btn-order a.blank{
	background-position:275px center;
}
#mv-slider .btn-order a:before{
	position:absolute;
	left:37%;
	bottom:35%;
}


/*--------------------------------------------------------------------------
	#mv-ban
---------------------------------------------------------------------------*/

#mv-ban{
	background:rgba(1,54,104,0.9);
	width:100%;
	text-align:center;
	position:absolute;
	top:653px;
}
#mv-ban ul{
	width:944px;
	min-height:90px;
	margin:0 auto;
	padding:20px 17px;
	overflow:hidden;
}
#mv-ban li{
	float:left;
}
#mv-ban li+li{
	float:right;
}
#mv-ban li a:hover{
	opacity:0.85;
}

/*--------------------------------------------------------------------------
	#ban-slider（スライダー）
---------------------------------------------------------------------------*/

#ban-slider {
	width:100%;
}


/*--------------------------------------------------------------------------
	Content
---------------------------------------------------------------------------*/
#Content{
	z-index:500;
	/*
	margin-top:-60px;
	*/
}

/*--------------------------------------------------------------------------
	Headline（お知らせ）
---------------------------------------------------------------------------*/
#Headline{
	background:#183E6F;
	padding: 30px 0;
}
#Headline .sec-inner{
	-ms-box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	-moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	background: #fff;
}
#Headline h2{
	float: left;
}
#Headline .slider{
	display: none;
	position: relative;
	float: left;
	width: 864px;
	height: 56px;
	background: #fff;
}
#Headline .slider .inner{
	position: absolute;
	left: 24px;
	overflow: hidden;
	width: 720px;
	height: 56px;
}
#Headline .slider .list{
	margin-top: -1em;
	overflow:hidden;
	position: absolute;
	top: 50%;
	left: 0;
}
#Headline .slider a{
	color: #444;
}
#Headline .slider .control{
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -1em;
}
#Headline .slider .control img{
	vertical-align: middle;
}
#Headline .slider .control .prev,
#Headline .slider .control .next,
#Headline .slider .control .count{
	display: inline;
	vertical-align: middle;
}
#Headline .slider .control .count{
	margin: 0 6px;
}

#Headline p.link{
	float: right;
	padding-top: 10px;
}
#Headline p.link a{
	padding-left: 20px;
	background: url(../images/index/news_arw01.png) no-repeat 0 5px;
	color: #444;
	text-decoration: none;
}
#Headline p.link a:hover{
	color: #004381;
	text-decoration: underline;
}

#Headline dl{
	float: left;
	width: 720px;
	overflow:hidden;
}
#Headline dt{
	float: left;
	width: 110px;
	font-size: 12px;
	font-size: 1.2rem;
	margin-top:0.5%;
}
#Headline dd{
	float: left;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	width: 610px;
	white-space: nowrap;
}

/* fs側追加 */
#Headline .tag {
	display: inline-block;
	width: 120px;
	height: 22px;
	margin-right: 5px;
	padding-bottom:2px;
	border-radius: 5px;
	text-align: center;
	line-height: 24px;
	vertical-align: middle;
	font-size:12px;
	font-size:1.2rem;
}
#Headline .tag.type01 {
	color: #FFF;
	background: none repeat scroll 0% 0% #f3ae4e;
}
#Headline .tag.type02 {
	color: #FFF;
	background: none repeat scroll 0% 0% #4eb1cb;
}

#Headline .tag.type03 {
	color: #FFF;
	background: none repeat scroll 0% 0% #4ab471;
}


/*----------------------------------------------------------------------
	Intro
----------------------------------------------------------------------*/
#Intro{
	background:#E5F0F9 url(/images/index/bg_intro.jpg) repeat-y 50% top;
	padding:80px 0 20px;
}
#Intro h2{
	font-size:35px;
	font-size:3.5rem;
	line-height:1.2;
	color:#455D6B;
}
#Intro h2 span{
	font-size:25px;
	font-size:2.5rem;
	display:block;
	font-weight:normal;
}
#Intro p{
	padding:20px 0 0;
}

#Intro .object{
	padding:0 0 50px;
	overflow:hidden;
	border-bottom:1px solid #83B3D1;
}
#Intro .support{
	padding:50px 0;
	overflow:hidden;
}

#Intro .object .left,
#Intro .support .left{
	width:400px;
}
#Intro .object .right,
#Intro .support .right{
	width:547px;
}
#Intro .object .right ul,
#Intro .support .right ul{
	overflow:hidden;
}
#Intro .object .right li,
#Intro .support .right li{
	width:273px;
	font-size:12px;
	font-size:1.2rem;
	line-height:1.6;
	text-align:left;
	vertical-align:middle;
	overflow:hidden;
	float:left;
}
#Intro .object .right li:nth-child(n+3),
#Intro .support .right li:nth-child(n+3){
	padding-top:20px;
}
#Intro .object .right li span,
#Intro .support .right li span{
	padding:5px 0 0;
	font-size:18px;
	font-size:1.8rem;
	letter-spacing:-0.01em;
	display:block;
}
#Intro .object .right li img,
#Intro .support .right li img{
	margin-right:10px;
	float:left;
	transition:opacity 0.15s linear;
}
#Intro .object .right li a,
#Intro .support .right li a{
	color:#455d6b;
	text-decoration:none;
}
#Intro .object .right li a:hover,
#Intro .support .right li a:hover{
	color:#1089c5;
}
#Intro .object .right li a:hover img,
#Intro .support .right li a:hover img{
	opacity:0.8;
}


/*----------------------------------------------------------------------
	Case
----------------------------------------------------------------------*/
#Case{
	background:url(/shared/images/page_ttl_bg.jpg) no-repeat 50% top;
	padding:35px 0;
}
#Case h3{
	font-size:35px;
	font-size:3.5rem;
	line-height:1.2;
	color:#FFF;
	text-align:center;
}
#Case h3 span{
	font-size:25px;
	font-size:2.5rem;
	font-weight:normal;
	display:block;
}
#Case .case-box{
	padding:25px 0 0;
	margin-right:-23px;
	font-size:0;
}
#Case .case-box dl{
	background:#FFF;
	width:260px;
	height:230px;
	padding:0 25px;
	margin-right:23px;
	line-height:1.6;
	font-size:14px;
	font-size:1.4rem;
	display:inline-block;
	vertical-align:top;
	transition:opacity 0.25s linear;
}
#Case .case-box dl:hover{
	opacity:0.9;
}
#Case .case-box dt{
	font-weight:bold;
	z-index:1000;
}
#Case .case-box dt.line-2{
	line-height:1.35;
}
#Case .case-box dt a{
	display:block;
	width:260px;
	height:230px;
	padding:0 25px;
	margin-left:-25px;
	color:#455D6B;
	text-decoration:none;
	transition:color 0.35s linear;
}
#Case .case-box dt a:hover{
	color:#004381;
	opacity:0.85;
}
#Case .case-box dt span{
	display:block;
	margin-left:-25px;
	padding:0 0 20px;
}
#Case .case-box dd{
	margin-top:-105px;
	z-index:1;
}
#Case .case-box dt.line-2 + dd{
	margin-top:-90px;
}
#Case .case-box dd span{
	width:34px;
	background:#20AEE5;
	margin-top:5px;
	padding:0 15px;
	color:#FFF;
	display:block;
}

/*----------------------------------------------------------------------
	lineup（Zenlogicトップページのみ表示）
----------------------------------------------------------------------*/
footer .lineup{
	display:block;
}