@charset "UTF-8";
/* CSS Document */

/*RESET*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, textarea, input {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  text-decoration:none;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}


body {
  line-height: 1;
}

ol, ul, li {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
input, textarea, button{
  -webkit-apparence:none;
  border:none;
  background: none;
  outline: none;
}
input:focus, textarea:focus{
  -webkit-apparence:none;
  outline: none;
  border:none;
}
img{
	border:none;
	outline: none;
	vertical-align: top;
	font-size:0;
	line-height: 0;
}
img a{
	border:none;
	outline: none;
}
a:focus{
	outline:none;
}
a {
	overflow:hidden;
}

* {margin: 0; padding: 0; outline: 0;}






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

body{
	width:100%;
	height:100%;
	min-height:100%;
	margin:0px;
	padding:0px;
	text-align:center;
	color:#00003E;
	font-size:12px;
	line-height:1.5;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:#FFF;
	-webkit-font-smoothing:subpixel-antialiased;
	-webkit-text-size-adjust: 100%;
}


header{
	width:100%;
	position:relative;
}
.mainimg{
	width:100%;
	position:relative;
	z-index:1;
}
.mainmb{ display:none;}
.mainpc{ display:block;}

h1{
	position:absolute;
	z-index:10;
	top:12%;
	bottom:0;
	width:35%;
	left:0;
	right:0;
	margin:auto;
}
h1 img{
	width:100%;
}
.logo{
	position:absolute;
	top:20px;
	right:20px;
	z-index:20;
}

header ul{
	width:100%;
	margin-top:0.4%;
}
header ul li{
	width:24.7%;
	float:left;
	margin-right:0.4%;
}
header ul li.last{
	margin-right:0;
}
header ul li img{
	width:100%;
}



.info{
	width:100%;
	margin:0 auto;
	max-width:920px;
	padding:60px 0;
}
.info h2{
	width:60%;
	margin:0 auto;
	margin-bottom:30px;
}
.info h2 img{
	width:100%;
}
.info p{
	margin-bottom:10px;
	line-height:1.7;
}


.present{
	width:100%;
	background:#00002E;
	color:#FFF;
	padding:20px 0;
}
.presentIn{
	width:90%;
	margin:0 auto;
	max-width:700px;
}
.presentIn .left{
	width:75%;
	float:left;
	text-align:left;
}
.presentIn .left h3{
	font-size:1.7em;
	margin-top:15px;
	margin-bottom:10px;
}
.presentIn .left p{
	font-size:0.9em;
}

.presentIn .right{
	width:20%;
	float:right;
}
.presentIn .right img{
	width:80%;
}



.item{
	width:100%;
	max-width:900px;
	margin:0 auto;
	margin-top:45px;
	padding-bottom:55px;
}
.item h2{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	font-size:1.8em;
	margin-bottom:30px;
}

.item ul{
	width:100%;
	margin:0 auto;
}

.item ul li{
	width:24%;
	margin:0 0.5%;
	float:left;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	font-size:1.2em;
	line-height:1.25;
}
.item ul li span{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: normal;
	font-size:0.9em;
}
.item ul li img{
	width:100%;
}

.item ul li p{
	padding-bottom:9px;
}
.item ul li a{
	color:#00003E;
}




.link{
	width:100%;
	background:#CCC;
}
.link a{
	width:100%;
	background:#999;
	padding:40px 0;
	display:block;
	font-size:1.8em;
	color:#FFF;
}
.link a:hover{
	background:#333;
}



.note{
	width:90%;
	margin:0 auto;
	margin-top:30px;
	max-width:900px;
	text-align:left;
	padding-bottom:80px;
}
.note h3{
	font-size:1.2em;
	padding-bottom:5px;
}
.note ul{
	padding-left:1.5em;
	font-size:0.9em;
}
.note ul li{
	list-style: outside disc;
	margin-bottom:3px;
}




@media screen and (max-width: 768px) {
.item ul{
	width:100%;
}
.item ul li{
	font-size:1.0em;
}

.presentIn{
	width:90%;
	margin:0 auto;
}
.presentIn .left{
	width:100%;
	float:none;
	text-align:center;
}

.presentIn .right{
	width:20%;
	float:none;
	margin:0 auto;
	margin-top:20px;
	padding-bottom:10px;
}
.presentIn .right img{
	width:80%;
}

}





@media screen and (max-width: 500px) {
.mainmb{ display:block;}
.mainpc{ display:none;}

.logo{
	position:absolute;
	top:5%;
	right:0;
	left:0;
	margin:0 auto;
	z-index:20;
}

h1{
	position:absolute;
	z-index:10;
	top:28%;
	bottom:0;
	width:65%;
	left:0;
	right:0;
	margin:auto;
}

header ul{
	width:99.5%;
	margin: 0 auto;
	margin-top:0.2%;
}
header ul li{
	width:49.4%;
	float:left;
	margin:0.3%;
}
header ul li.last{
	margin-right:0;
}
header ul li img{
	width:100%;
}
.info h2{
	width:80%;
}
.info p{
	width:85%;
	margin:0 auto;
	margin-bottom:10px;
	line-height:1.7;
	text-align:left;
}
.info p br{
	display:none;
}


.presentIn .left{
	width:100%;
	float:none;
	text-align:left;
}
.presentIn .left h3{
	font-size:1.5em;
}
.presentIn .left br{
	display:none;
}

.presentIn .right{
	width:50%;
}
.presentIn .right img{
	width:100%;
}

.presentIn .right{
	width:20%;
	float:none;
	margin:0 auto;
	margin-top:20px;
	padding-bottom:10px;
}
.presentIn .right{
	width:45%;
	float:none;
	margin:0 auto;
	margin-top:20px;
	padding-bottom:20px;
}
.presentIn .right img{
	width:80%;
}



.item{
	width:90%;
}
.item ul{
	width:100%;
	margin:0 auto;
}

.item ul li{
	width:49%;
	margin:0 0.5%;
	font-size:1.2em;
	line-height:1.25;
}
.item ul li img{
	width:100%;
}

.item ul li p{
	padding-bottom:9px;
}


.link a{
	width:100%;
	background:#999;
	padding:60px 0;
	display:block;
	font-size:1.3em;
	color:#FFF;
}

}

ul:after,
.presentIn:after{
	  content: "";
	  display: table;
	  float:none;
	  clear: both;
}