@charset "utf-8";
/* CSS Document */


@import "common.css";
@import "contents_nav.css";
@import "header.css";
@import "footer.css";

/* html5reset */
@import "reset.css";
@import "font-awesome.css";


#window{
	background:url(../image/window_bg.jpg) top no-repeat;
	background-size:100% auto;
	background-attachment: fixed;
}

#test_space{
	height: 1000px;
	width: 100%;
}



#slide{
	/*height: 500px;*/
	overflow: hidden;
	position: relative;
	width: 100%;
}


/*************************
	@@top_image
*************************/
#top_image {
	width: 100%;
	margin:90px auto 0px auto;
    box-sizing: border-box;
    font-size:0;
}

#top_image img {
	width: 100%;
}

#top_image #slide .top_copy_box {
	position: absolute;/*絶対配置*/
	width:100%;
	top: 50%;
	left: 50%;
-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
	text-align:left;
	/*background-color: rgba(0,0,50,0.5);*/
	z-index:1000;
	padding:30px 0px 30px 30px;
	box-sizing: border-box;
}
#top_image #slide .top_copy_box .copy{
	color: #fff;
	font-size: 42px;
	text-align:left;
	line-height: 180%;
	font-weight: 200;
	text-shadow: 2px 2px 3px #000;
}
#top_image #slide .top_copy_box .txt{
	color: #fff;
	font-size: 20px;
	text-align:left;
	line-height: 150%;
	text-shadow: 2px 2px 3px #000;
}
#top_image #slide .top_copy_box img {width: 160px; margin-bottom:20px; /*box-shadow: 2px 2px 4px #000;*/}


#top_image .top_copy_box_u {
	position: absolute;/*絶対配置*/
	width:100%;
	bottom: 0px;
	background-color: rgba(0,0,50,0.0);
	z-index:1000;
	padding:30px 0px 80px 20px;
	box-sizing: border-box;
}
#top_image .top_copy_box_u .copy_h{
	color: #C1994C;
	font-size: 44px;
	text-shadow: 2px 2px 4px #000;
	line-height: 200%;
	font-weight: normal;
	padding:5px 10px;
	background: #02172A;
}
#top_image .top_copy_box_u .copy{
	width:70%;
	color: #fff;
	font-size: 24px;
	text-shadow: 2px 2px 4px #000;
	line-height: 150%;
}


@media screen and (max-width: 960px){

#top_image {
	margin:41px auto 0px auto;
}
#top_image #slide .top_copy_box {
	text-align:center;
	padding:10px;
}
#top_image #slide .top_copy_box .copy{
	font-size: 28px;
	text-align:center;
	text-shadow: 2px 2px 3px #000;
}
#top_image #slide .top_copy_box .txt{
	font-size: 16px;
	text-align:center;
	line-height: 150%;
}
#top_image #slide .top_copy_box img {width: 30%; margin-bottom:20px; /*box-shadow: 2px 2px 4px #000;*/}


#top_image .top_copy_box_u {
	padding:2px 2px 10px;
}
#top_image .top_copy_box_u .copy_h{
	font-size: 20px;
}
#top_image .top_copy_box_u .copy{
	font-size: 14px;
	margin :0 auto;
	width:99%;
}





}




/*************************
	@@selling_points
*************************/
#selling_points{
	width:100%;
	text-align: center;
	background: none;
	padding:80px 0px 80px 0px;
	margin:0px;
	box-sizing: border-box;
	font-size:0;
	/*border-bottom:#fff solid 1px; border-top:#fff solid 1px;*/ 
}


@media screen and (max-width: 960px){
#selling_points{
	width:100%;
	margin:0px auto;
	padding:40px 15px 20px 15px;
}

}



/*************************
	@@top_index
*************************/
#top_index{
	width:100%;
	/*background-color:#009fb9;*/
	padding:100px 0px 80px 0px;
	box-sizing: border-box;
}

#top_index .link_bt{
	width:90%;
	margin:5px;
}


#top_index  .content_link {
	width:95%;
	font-size:16px;
	box-sizing: border-box;
	background:#fff;
	margin:15px auto;
}

#top_index  .content_link a{
	display:block;
	color:#4a4a4a;
	padding:10px 0px;
	border:#ccc solid 1px;
	text-decoration:none;
}
#top_index  .content_link a:hover{
	color:#4a4a4a;
	/*background:#f0e6d0;*/
	border-top:#fff solid 1px;
	border-left:#fff solid 1px;
	border-right:#fff solid 1px;
	border-bottom:#d1b069 solid 2px;
}

#top_index .contents img{
	box-shadow: 2px 2px 4px gray;
}

@media screen and (max-width: 960px){
#top_index{padding:50px 0px 50px 0px;}
}

/*************************
	@@topics
*************************/
#topics{
	width:100%;
	text-align: center;
	background:url(../image/top_image/top_slide_00.jpg) center no-repeat;
	background-color:none;
	padding:100px 0px 100px 0px;
	box-sizing: border-box;
}

#topics .box{
	width:100%;
	background-color: rgba(255,255,255,0.8);
	padding:30px;
	margin:auto;
	text-align: left;
	box-sizing: border-box;
}


#topics ul{
	list-style-type: none;
	text-align: left;
}
#topics ul li{
	margin-top: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #009fb9;
	font-size: 18px;
	line-height: 120%;
	color: #333333;
}
#topics ul li a{
	color: #111;
	display: block;
	text-decoration: none;
	padding:5px;
}
#topics ul li a:hover{background-color:#9BCED9;}
#topics ul li img {
	width:100px;
	margin: auto 10px 5px auto;
	vertical-align: middle;
	display: inline-block;
}
#topics ul li .t_date{
	margin-left: 3px;
	font-size: 14px;
	display: inline-block;
}


#topics ul li .txt{
	font-size:18px;
	line-height:140%;
	display: inline-block;
	color: #003670;
}


@media screen and (max-width: 960px){
#topics{
	padding:20px 0px 20px 0px;
}

#topics .box{
	width:95%;
	padding:15px;
}

#topics h2{
	font-size:36px;
}

#topics ul{
	list-style-type: none;
	text-align: left;
}
#topics ul li{
	font-size: 14px;
	margin-top: 0px;


}
#topics ul li a{
	padding:5px;
}
#topics ul li a:hover{}
#topics ul li img {
	width:20%;
	margin: auto 10px 5px auto;
}
#topics ul li .t_date{
	margin-left: 3px;
	font-size: 10px;
}

#topics ul li .txt{
	font-size:14px;
	line-height:140%;
}
}




/*************************
	@@p_bnr
*************************/
#p_bnr{
	width:100%;
	text-align: center;
	background:url(../image/bg_02.jpg);
	padding:50px 0px 50px 0px;
	margin:0px auto;
	box-sizing: border-box;
	/*border-bottom:#fff solid 1px; border-top:#fff solid 1px;*/ 
}

#p_bnr .contents img{
	box-shadow: 2px 2px 4px gray;
}
@media screen and (max-width: 960px){
#p_bnr{
	width:100%;
	margin:0px auto;
	padding:0px 0px 30px 0px;
}
}





/*************************
	@@u_contents
*************************/
#u_contents{
	width:100%;
	padding:70px 0px 40px 0px;
	text-align: center;
	box-sizing: border-box;
	font-size:0;
}

@media screen and (max-width: 960px){
#u_contents {
	padding:35px 0px 35px 0px;
}

}






/*************************
	@@privacy
*************************/
#privacy{
	width:100%;
	text-align: center;
	background-color:#fff;
	padding:70px 0px 20px 0px;
	box-sizing: border-box;
	margin:30px auto 0px auto;
}
#privacy img{
	overflow:hidden;
    -webkit-border-radius: 3%; 
    -moz-border-radius: 3%; 
}


@media screen and (max-width: 960px){
#privacy{
	padding:35px 0px 5px 0px;
	margin:60px auto 0px auto;
}

}

