@charset "utf-8";

/*PC・タブレット・スマホ共通設定
---------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
body {
  margin: 0px;
  padding: 0px;
  font: 14px/2 "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";  /*文字サイズ、行間、フォントファミリー*/
  color: #333;  /*全体の文字色*/
  background: #fff;  /*背景色*/
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure{
  margin: 0px;
  padding: 0px;
}
ul{
  list-style-type: none;
}
img {
  border: none;
  vertical-align: bottom;
}
input,textarea,select {
  font-size: 1em;
}
form {
  margin: 0px;
}
table {
  border-collapse:collapse;
  font-size: 100%;
  border-spacing: 0;
}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
  color: #333;  /*リンクテキストの色*/
}
a:hover {
  color: #0234a5;      /*マウスオン時の文字色（全体）*/
  text-decoration: none;  /*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

/*コンテナー（HPを囲むブロック）
---------------------------------------------------------------------------*/
#container {
  width: 720px;  /*コンテナー幅*/
  margin: 20px auto 0px;
}

/*ヘッダー（サイト名ロゴが入ったブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
  background: #0234a5;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: radial-gradient(circle 400px at 20% -30px,#2589fd,#0234a5);  /*ロゴ背後の光を含めた背景色*/
  border-radius: 8px;  /*角丸のサイズ*/
  height: 80px;  /*ヘッダーの高さ*/
  -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.3);  /*影の設定。右・下・ぼかし幅・色の設定*/
  box-shadow: 0px 0px 10px rgba(0,0,0,0.3);      /*同上*/
  margin-bottom: 20px;  /*ヘッダーとメニューの間のスペース*/
  position: relative;
}

/*ロゴ画像*/
header #logo {
  line-height: 1;
  position: absolute;
  left: 40px;  /*ヘッダーブロックに対して左から40pxの場所に配置*/
  top: 20px;  /*ヘッダーブロックに対して上から40pxの場所に配置*/
  color:#fff;
}

/*コンテンツ
---------------------------------------------------------------------------*/
#contents {
  clear: left;
}

/*メインコンテンツ
---------------------------------------------------------------------------*/
#main {
  width: 720px;  /*メインコンテンツ幅*/
  padding-bottom: 30px;
}

/*mainコンテンツのh2タグの設定*/
#main h2 {
  margin-bottom: 15px;
  font-size: 100%;
  color: #FFF;    /*文字色*/
  background: #0133a4;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: -webkit-gradient(linear, left top, left bottom, from(#2658c9), to(#0133a4));  /*グラデーション*/
  background: -webkit-linear-gradient(#2658c9, #0133a4);  /*同上*/
  background: linear-gradient(#2658c9, #0133a4);      /*同上*/
  padding: 5px 15px;  /*左から上下、左右への余白*/
  border-radius: 8px;  /*角丸のサイズ*/
}

/*mainコンテンツのh3タグの設定*/
#main h3 {
  margin: 15px 0px;
  font-size: 100%;
  background: #FFF;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#ededed));  /*グラデーション*/
  background: -webkit-linear-gradient(#FFF, #ededed);  /*同上*/
  background: linear-gradient(#FFF, #ededed);      /*同上*/
  padding: 4px 15px;  /*上下、左右への余白*/
  border: 1px solid #bcbcbc;  /*枠線の幅、線種、色*/
  border-radius: 8px;  /*角丸のサイズ*/
}

/*mainコンテンツのh3タグの１文字目への設定*/
#main h3::first-letter {
  border-left: 3px solid #0234a5;  /*左側のアクセント用ラインの幅、線種、色*/
  padding-left: 10px;  /*アクセントラインと文字の間にとる余白*/
}

/*mainコンテンツの段落タグ設定*/
#main p {
  padding: 0px 15px;  /*左から、上、左右、下への余白*/
  margin 5px 0px;
}

#main p + p {
  padding-top: 0px;
}

#main h2 + p,
#main h3 + p {
  padding-top: 0px;
  margin-top: -5px;
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
  width: 720px;
  margin: 0px auto 20px;
  clear: both;
  text-align: center;
  padding: 15px 0px;
  background: #0234a5;  /*背景色*/
  border-radius: 8px;    /*角丸のサイズ*/
  color: #fff;  /*文字色*/
}
footer .pr {
  display: block;
  font-size: 80%;
}
footer a {
  text-decoration: none;
  color: #fff;  /*文字色*/
}
footer a:hover {
  color: #fff;  /*文字色*/
}


/*テーブル１
---------------------------------------------------------------------------*/
.ta1 {
  width: 100%;
  margin-bottom: 5px;
  background: #fff;  /*背景色*/
}
.ta1, .ta1 td, .ta1 th{
  border: 1px solid #CCC;  /*テーブルの枠線の幅、線種、色*/
  vertical-align: middle;
}
/*テーブル内の右側*/
.ta1 td{
  padding: 10px;
}
/*テーブル内の左側*/
.ta1 th{
  width: 200px;
  padding: 10px;
  text-align: left;
  background: #f1c99e;  /*背景色*/
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi{
  width: auto;
  text-align: left;
  color: #FFF;  /*文字色*/
  background: #333;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: -webkit-gradient(linear, left top, left bottom, from(#4b4b4b), to(#333));  /*グラデーション*/
  background: -webkit-linear-gradient(#4b4b4b, #333);  /*同上*/
  background: linear-gradient(#4b4b4b, #333);      /*同上*/
}
.ta1 img {
  float: right;
  vertical-align: middle;
}
.block {
  width: auto;
  padding: 20px;
  margin: 10px 0px;
  background: #fff;
  box-shadow: 0 0 50px #87cefa inset;
  -moz-box-shadow: 0 0 50px #87cefa inset;
  -webkit-box-shadow: 0 0 50px #87cefa inset;
}
.blockerr {
  width: auto;
  padding: 20px;
  margin: 10px 0px;
  background: #fff;
  box-shadow: 0 0 50px #F96250 inset;
  -moz-box-shadow: 0 0 50px #F96250 inset;
  -webkit-box-shadow: 0 0 50px #F96250 inset;
}
.helpBlock {
  color: red;
}
.hisu {padding-left: 10px;}
/*inputボタンの設定
---------------------------------------------------------------------------*/
input[type="submit"],
input[type="button"],
input[type="reset"] {
  width: 250px;  /*ボタン幅*/
  padding: 10px;  /*ボタン内の余白*/
  margin: 10px 0px;
  border-radius: 30px;  /*角丸のサイズ*/
  background: #e5e5e5;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#e5e5e5));  /*グラデーション*/
  background: -webkit-linear-gradient(#FFF, #e5e5e5);  /*同上*/
  background: linear-gradient(#FFF, #e5e5e5);      /*同上*/
  font-size: 16px;  /*文字サイズ*/
  letter-spacing: 0.1em;  /*文字間隔を少し広くする設定*/
  border: 1px solid #999;  /*枠線の幅、線種、色*/
}
/*ボタンのマウスオン時の設定*/
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover {
  background: #FFF;  /*背景色（古いブラウザだとここの色のみが出ます）*/
  background: -webkit-gradient(linear, left top, left bottom, from(#e5e5e5), to(#FFF));  /*グラデーション*/
  background: -webkit-linear-gradient(#e5e5e5, #FFF);  /*同上*/
  background: linear-gradient(#e5e5e5, #FFF);      /*同上*/
}

/*PAGE TOP設定
---------------------------------------------------------------------------*/
#pagetop {
  clear: both;
}
#pagetop a {
  color: #FFF;    /*文字色*/
  font-size: 10px;  /*文字サイズ*/
  background: #333;  /*背景色*/
  text-decoration: none;
  text-align: center;
  width: 12em;  /*ボックス幅*/
  display: block;
  float: right;
  margin-right: 30px;
  letter-spacing: 0.1em;  /*文字間隔を少し広めにとる設定。*/
}
/*マウスオン時*/
#pagetop a:hover {
  background-color: #666;  /*背景色*/
  color: #FFF;      /*文字色*/
}

/*その他
---------------------------------------------------------------------------*/
.clear {
  clear: both;
}
.pr {
  font-size: 10px;
}
.btn {
  font-size: 13px;
}
.wl {
  width: 96%;
}
.ws {
  width: 40%;
}
/**** 生年月日対応時 追加分 ****/
.wss {
  width: 10%;
}
.wssel {
  width: 15%;
}
/****       ****       ****/
/**** 講習会WEB改訂追加分 ****/
.wname {
  width: 80%;
}
.wms {
  width: 45%;
}
.wmss {
  width: 30%;
}
.wml {
  width: 80%;
}
.wadd4 {
  width: 74.25%;
}
.mail {
  width: 50%;
}
/****       ****       ****/
.c {
  text-align: center;
}
.r {
  text-align: right;
}
figcaption {
  font-size: 11px;
}
img {
  max-width: 100%;
  height: auto;
}
.newicon {
  background: #F00;
  color: #FFF;
  font-size: 10px;
  padding: 0px 5px;
  border-radius: 2px;
  margin: 0px 5px;
}
#menubar_hdr {
  display: none;
}



/*ここからスマートフォン用（480px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media (max-width : 480px){

/*コンテナー（HPを囲むブロック）
---------------------------------------------------------------------------*/
#container {
  width: auto;
}

/*ヘッダー（サイト名ロゴが入ったブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
  height: auto;
  padding: 20px 10px;
  text-align: center;
  margin-bottom: 10px;
}
/*ロゴ画像*/
header #logo {
  position: static;
}

/*main,subコンテンツ
---------------------------------------------------------------------------*/
#main, #sub {
  float: none;
  width: auto;
}

/*mainコンテンツ
---------------------------------------------------------------------------*/
/*mainコンテンツの段落タグ設定*/
#main p {
  padding: 0.5em 5px 0.5em;  /*左から、上、左右、下への余白*/
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
  width: auto;
  margin: 15px;
}

/*テーブル１
---------------------------------------------------------------------------*/
.ta1 {
  width: 100%;
}
/*テーブル内の右側*/
.ta1 td{
  width: auto;
  padding: 2px;
}
/*テーブル内の左側の見出し部分*/
.ta1 th{
  width: 100px;
  padding: 2px;
}
/*その他
---------------------------------------------------------------------------*/
.wms {
  width: 62%;
}
.wml {
  width: 96%;
}
.wadd4 {
  width: 96%;
}
.mail {
  width: 96%;
}

}