@charset "UTF-8";

/*-----------------------------------------------------------------------------------slide----------*/

#list_carousel {
width: 100%;
overflow:hidden;
padding-top:40px;
background:url(../images/bg_slide.png) no-repeat center 11px;
}

#list_carousel li {
height: 360px;
float:left;
padding:0 10px;
}

#list_carousel li a:hover img{
opacity:0.5;
background:url(../images/ichimatsu.png) repeat 0 0;
}

.slide_nav {
width: 100%;
margin:0 auto;
position:relative;
top:-360px;
z-index:50;
}

.prev, .next {
zoom:1;
display: block;
height: 360px;
width: 50%;
top: 0;
position: absolute;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}

.prev:hover, .next:hover {
opacity:0.5;
zoom:1;
cursor:pointer;
}

.prev {
left: -450px;/* スライドする画像の横半分の値 */
background:url(../images/ichimatsu.png) repeat 0 0;
text-align:right;
}

.next {
background:url(../images/ichimatsu.png) repeat 0 0;
right: -450px;/* スライドする画像の横半分の値 */
}

#pager {
text-align:center;
padding:10px;
}

#pager a {
background-color: #ccc;	
border-radius:10px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
}

#pager a:hover { background:#eee; }

#pager a span { display: none; }

#pager a.selected { background-color: #02328d; }


/*-----------------------------------------------------------------------------------guide----------*/

#guide{
margin:10px auto 0;
width:100%;
background:url(../images/bg_guide.png) repeat-x 0 0;
}

#guide h2{
text-align:center;
}

#guide ul{
width:876px;
margin:0 auto;
margin-top:16px;
}

#guide li{
float:left;
width:180px;
line-height:1.8;
margin-left:52px;
}

#guide li:first-child{ margin-left:0; }

#guide li span{
margin-top:20px;
display:block;
}

/*-----------------------------------------------------------------------------------about----------*/

#about{
margin-top:40px;
width:100%;
}

#about .photo{
width:100%;
height:300px;
background:url(../images/about_pic.jpg) no-repeat center center;
background-size:cover;
}

.box_about{
margin-top:-130px;
width:860px;
margin-left:auto;
margin-right:auto;
}

#about h2{
text-align:right;
padding-right:55px;
}

.box_about h3{
margin-top:-110px;	
font-weight:bold;
font-size:14px;
color:#02328d;
}

.btn_about{ 
margin-top:14px;
line-height:1.0;
}

.btn_more {
display:inline-block;
width:240px;
height:42px;
text-align:center;
text-decoration:none;
line-height:42px;
outline:none;
}

.btn_more::before,
.btn_more::after {
position:absolute;
z-index:-1;
display:block;
content:'';
}

.btn_more,
.btn_more::before,
.btn_more::after {
-webkit-transition:all .3s;
transition:all .3s;
}

.btn_more {
border:1px solid #02328d;
color:#02328d;
overflow:hidden;
font-weight:bold;
}

.btn_more:hover {
color:#fff;
background-color:#02328d;
cursor:pointer;
}

/*-----------------------------------------------------------------------------------pickup----------*/

#pickup{
background:url(../images/ichimatsu02.jpg) repeat 0 0;
width:100%;
margin-top:60px;
}

#pickup ul{
width:960px;
margin:0 auto;
padding:30px 0;
}

#pickup li{
width:310px;
float:left;
margin-left:15px;
}

#pickup li:first-child{ margin-left:0px; }

#pickup h3{
color:#fff;
font-weight:bold;
font-size:14px;
margin-top:10px;
background:url(../images/cir_arrow.png) no-repeat 0 7px;
padding-left:22px;
}

#pickup p{ 
color:#fff;
line-height:1.8;
}

/*-----------------------------------------------------------------------------------story---------*/

#story{
width:960px;
margin:45px auto 0;
/*background:url(../images/pic_story.jpg) no-repeat right top;*/
background:none;
height:210px;
padding-bottom:30px;
}

#story h2{ padding-top:20px; }

#story .read{ 
margin-top:20px;
line-height:1.8;
}

.btn_story{ 
margin-top:14px;
line-height:1.0;
}

#story .left{
float:left;
}
#story .right{
float:right;
}

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

#news{
width:100%;
margin-top:45px;
background-color:#f5f5f5;
}

.news_cont{
width:960px;
margin:0 auto;
}

.news_cont h2{
float:left;
padding:20px 20px 20px 0;
border-right:3px solid #fff;
}

.news_cont p{
float:left;
padding-left:20px;
margin-top:25px;
}

.news_cont p a:hover{ color:#999; }

.news_list{
float:right;
padding-left:22px;
background:url(../images/arrow_blue.png) no-repeat 0 6px;
margin-top:25px;
}

.news_list a:hover{ color:#02328d; }


#news_line {
width:700px;
float:left;
padding-left:20px;
padding-right:20px;
margin-top:25px;
}

#news_line li a:hover{ color:#999; }