@charset "utf-8";
/* CSS Document */
body, article,aside,header,hgroup,menu, nav, footer,div,p, object, details, p,h1, h3, h4  {display: block; padding: 0; margin: 0;}
@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }
html, body { min-height: 100%;}
body {min-width: 960px;}
img {border: none; margin: 0px; padding: 0px; height: auto; max-width: 100%; vertical-align: bottom;}
#ie8 img {width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8. */}
a:hover img {filter: alpha(opacity=80);	-moz-opacity: 0.8;	opacity: 0.8;}
li { list-style:none;}

/*space*/
.mbS { margin-bottom:5px !important;}
/*font*/
body {color: #3e3e3e;line-height: 160%;margin: 0px;padding: 0px;font-size: 16px;font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro,  Osaka , "ＭＳ Ｐゴシック", "MS PGothic", sans-serif" ; background:#fff;word-wrap: break-word;}
h1,h2,h3,h4,h5,h6 {font-weight:normal; text-align:center; clear:both;}
.f12 {font-size: 12px;}
.f14 {font-size: 14px;}
.fBlue { color:#2782b9;}
.clear {clear: both;}
h1 { font-size:20px; padding:45px 20px 30px;}
h2 {font-size:26px;margin-bottom:30px; line-height:1.2em;}
h3 {font-size:18px; padding-top:20px;margin-bottom:20px;}
h4 {font-size:18px; text-align:left; background:url(img/h4.png) left bottom no-repeat; padding:5px 0 5px 35px;margin-bottom:20px;}
.fCenter { text-align:center;}
.fRight { text-align:right;}
.fLeft { text-align:left;}
a { color:#09b2f1; text-decoration:underline;}
.kadoR { border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */  }

/*box*/
.wrap { width:770px; margin:0 auto; padding:60px 0 40px;}
.wrap2 { width:960px; margin:0 auto; }
.boxR { float:right; margin-left:3%;}
.boxL { float:left; margin-right:3%;}
.box50 {width:47%; display:inline-block;vertical-align:top; margin-bottom:20px;}
.box25 {width:25%; display:inline-block;vertical-align:top; margin-bottom:10px; float:left;}
.boxBlue { background:#ebf8ff; padding:30px; min-height:370px; margin-bottom:40px;height: auto;}
.boxBlue2 { background:#b8e8fb url(img/recommendBg.jpg) ; padding:30px 0; min-height:300px;height: auto;}

p { margin-bottom:20px;}
a.bt  {display:block; text-decoration:none; width:95%; background:#09b2f1;padding:8px 15px; text-align:center; margin:0 auto;box-shadow: 0 2px 4px rgba(0,0,0,0.3);}
a.bt:hover {background:#2cc0f7;}

table {margin-bottom:40px; border:1px solid #e2e2e2;}
table th { background: #c4c4c4; padding:10px; border:1px solid #e2e2e2;}
table td { background:#fff; padding:10px; border:1px solid #e2e2e2;}
table.typeA {margin-bottom:40px; border:1px solid #f4f4f4;}
table.typeA th { background: #dddddd; padding:10px; border:1px solid #f4f4f4;}
table.typeA td { background:#efefefi; padding:10px; border:1px solid #f4f4f4;}

ul { padding-left:20px; margin-bottom:20px;}
ul li { list-style: outside; margin-bottom:8px;}
ul ul {margin-bottom:0px;}
ul ul li { margin-bottom:5px;}

/*header*/
header .wrap2 {margin:0 auto; padding:0; height:60px;}
header h1 {width:50%; float:left; line-height:60px;}
nav { width:50%; float:right; padding:0; margin:0; text-align:right}

/*mainImg*/
#mainImg {
padding-top:50px;
background: #2782b9; /* Old browsers */
background: -moz-linear-gradient(top,  #2782b9 17%, #4399ca 32%, #6bb8e1 58%, #87cdee 90%, #bbe1f4 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #2782b9 17%,#4399ca 32%,#6bb8e1 58%,#87cdee 90%,#bbe1f4 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #2782b9 17%,#4399ca 32%,#6bb8e1 58%,#87cdee 90%,#bbe1f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2782b9', endColorstr='#bbe1f4',GradientType=0 ); /* IE6-9 */
text-align:center; clear:both;}
  
/*contents*/
#catch {color:#fff; background:#2782b9; margin:0; padding:0 0 20px;}
#about { background:#f4f4f4;}
#outline { background:#eaeaea url(img/outlineBg.jpg); clear:both;}
.pt { color:#FFF; background:#2782b9; padding:5px 14px; display:block; width:200px; margin-bottom:15px; clear:both;}

.pageup{  position: fixed;
    bottom: 50px;
    right: 10px;
    padding: 11px;
    -ms-filter: "alpha(opacity=80)";
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
text-decoration:none;}


/*footer*/
footer {font-size:14px; text-align:right; margin-bottom:10px; padding-top:45px;}
.copy { text-align:right; font-family: Arial, Verdana, Geneva, sans-serif; font-size:12px;}

@media screen and (max-width:732px) {
/*スマホ用のcssを記述*/
header .wrap2 {padding:0; height:auto;}
body {min-width: 320px; width:100%;}
.wrap2 {width:100%; margin:0 auto;}
.wrap { width:100%; padding:40px 0px 20px;}
header img { width: auto;}
#mainImg {padding:30px 10px 0;}
.boxR { float: inherit; margin-left:0%;}
.boxL { float: inherit; margin-right:0%;}
.box50 {width:96%; display:inherit; padding:0 2%;}
.box25 {width:50%; text-align:center;}
a.bt  { width:95%;padding:6px 0px;}
.boxBlue {padding:30px 2% 10px ; min-height:250px; margin-bottom:40px;height: auto; width:96%;}
.boxBlue2 { padding:20px 5px; min-height:450px;}
header .box50 {width:50%; padding:0; float:left; margin:0;}
header .wrap2 {margin:0 auto; padding:0; height:auto;}
h1 { font-size:18px; padding:30px 15px;}
h2 {font-size:22px;margin-bottom:20px;}
h4 {background:url(img/h4.png) left bottom no-repeat; padding:5px 0 5px 30px;margin-left:8px;}
ul { margin-left:5px;}
footer { text-align:center}
.pdPh { padding:0 2%}
.pt {margin-left:5px; clear:both;}
}
@media screen and (max-width:350px) {a.bt img {width:90%;}.boxBlue2 {min-height:380px;}}