@charset "UTF-8";

body {
	font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
    margin:0;
    padding: 0.8em 0.8em;
    background-color: #ffffff;
    font-size: 18px;
    line-height: 1.3em
    }

p { line-height: 1.4em; 
    font-size: 18px;
    padding: 1em 1em }

table  {width:100%;
        border-collapse:collapse; 
        border:  3px sorid  #696969;
       font-size: 18px;
       line-height: 1.4em; 
       }



th,td  {padding: 0.5em 0.8em;
       border:  3px sorid  #696969
       }

/* font指定 */
.f1 { font-size:18px; font-family:"arial"; }
.f2 { font-size:18px; font-family:"Century Gothic"; }
.f3 { font-size:18px; font-family:"arial unicode ms"; }

/* box背景 */

.box2 {background-color: #fffafa;
      padding: 15px 15px}

/* 説明 */

.setsumei h1	{margin-top: 0;
	margin-bottom: 20px;
	padding-left: 15px;
	border-left: solid 10px #191970;
	border-bottom: solid 1px #191970;
	font-size: 22px;
	font-weight: bold;
        color: #800000}

.setsumei h2 {margin-top: 0;
	margin-bottom: 20px;
	padding-left: 15px;
	border-left: solid 10px #778899;
	border-bottom: solid 1px #778899;
	font-size: 22px;
	font-weight: bold;
        color: #000080}

.setsumei h3 {margin-top: 0;
	margin-bottom: 20px;
	padding-left: 15px;
	font-size: 22px;
	font-weight: bold;
        color: #000000}

.setsumei p	{margin-top: 0;
	margin-bottom: 20px
	line-height: 1.4em; 
    font-size: 18px;
    padding: 0.5em 1em }

.setsumei img	{max-width: 100%;
    margin: 5px 7px;
	height: auto}

.setsumei table  {width:100%;
         border: 1px #c0c0c0 solid;
         border-radius: 7px;
         border-spacing: 0;
         border-collapse: separate;;
         background-color: #ffffff;
         font-size: 18px;
         line-height: 1.6em
         }

.setsumei table tr td {
        padding: 1em;
        border-left: 1px #c0c0c0 solid;
        border-top: 1px #c0c0c0 solid;
        }
.setsumei table tr td:first-child {
        border-left: none;
        }
        
.setsumei table tr:first-child td {
        border-top: none;
        }

/* メニュー */
            
.menu ul	{margin: 0;
	padding: 0;
	list-style: none}

.menu li a {display: block;;
            margin-right: 3px;
            padding: 1px;
            background-color: #4682b4;
            border-radius: 3px;
            color: #ffffff;
            font-size: 15px;
            text-align: center;
            text-decoration: none}

.menu li a:hover {background-color: #c0c0c0}

.menu ul:after	{content: "";
	display: block;
	clear: both}

.menu li	{float: left;
	width: 20%}


/* メニュー２ */
            
.menu2 ul   {margin: 0;
           padding: 1px;
           list-style: none}

.menu2 li a	{display: block;
	padding: 5px;
	background-color: #ffffff;
	color: #000000;
	font-size: 16px;
	text-decoration: none}

.menu2 li a:hover	{background-color: #eeeeee}

.menu2 h1 {margin-top: 0;
           margin-bottom: 10px;
           padding: 5px;
           background-color: #4169e1;
           color: #ffffff;
           font-size: 18px}


/* サイドメニュー */
.sidemenu ul   {margin: 0;
           padding: 1px;
           list-style: none}

.sidemenu li a	{display: block;
	padding: 5px;
	background-color: #ffffff;
	color: #000000;
	font-size: 16px;
	text-decoration: none}

.sidemenu li a:hover	{background-color: #eeeeee}

.sidemenu h1 {margin-top: 0;
           margin-bottom: 10px;
           padding: 5px;
           background-color: #778899;
           color: #ffffff;
           font-size: 15px}


/* 記事 */

.kiji h1	{margin-top: 0;
	margin-bottom: 20px;
	padding-left: 21px;
	border-left: solid 10px #191970;
	border-bottom: solid 1px #191970;
	font-size: 24px;
	font-weight: bold;
        color: #000080}

.kiji h2 {margin-top: 0;
	margin-bottom: 20px;
	padding-left: 21px;
	border-left: solid 10px #778899;
	border-bottom: solid 1px #778899;
	font-size: 22px;
	font-weight: bold;
        color: #000080}

.kiji p	{margin-top: 0;
	margin-bottom: 20px}

.kiji img	{max-width: 100%;
	height: auto}


/* 企業紹介メニュー */
.kigyou	{padding: 20px;
	border: solid 2px #dddddd}

.kigyou h1	{margin-top: 0;
	margin-bottom: 5px;
	font-size: 16px;
	color: #666666}

.kigyou ul	{margin: 0;
	padding: 0;
	list-style: none}

.kigyou li a	{display: block;
	padding: 5px;
	border-bottom: dotted 1px #dddddd;
	color: #2288bb;
	font-size: 14px;
	text-decoration: none}

.kigyou li a:hover	{background-color: #eeeeee}

.kigyou li a img	{border: none}

.kigyou a:after	{content: "";
	display: block;
	clear: both}

.kigyou img	{float: left;
	width: 35px}

.kigyou .text	{float: none;
	width: auto;
	margin-left: 25px;
	padding-left: 15px}

.kigyou span	{display: block;
	color: #666666;
	font-size: 12px}


/* サービスメニュー */

.shoukai {margin-bottom: 20px}

.shoukai a {display: block;
           border: solid 1px #dddddd;
           background-color: #ffffff;
           color: #000000;
           text-decoration: none}

.shoukai a:hover {box-shadow: 0 0 10px #dddddd}

.shoukai img {max-width: 100%;
         height: auto;
         border: none;
         margin-bottom: 10px;
         vertical-align: bottom}

.shoukai h1 {margin-top: 10px;
            margin-bottom: 5px;
            margin-left: 15px;
            margin-right: 15px;
            color: #000080;
            font-size: 22px}

.shoukai p {margin-top: 0;
            margin-bottom: 5px;
            margin-left: 15px;
            margin-right: 15px;
            font-size: 16px}
            

/* 概要 */
.gaiyou	{margin-bottom: 30px}

.gaiyou ul	{margin: 0;
	padding: 0;
	list-style: none}

.gaiyou li a	{display: block;
	margin-bottom: 10px;
	padding: 0;
	color: #000000;
	font-size: 20px;
	text-decoration: none}

.gaiyou li a:hover	{background-color: #eeeeee;
	opacity: 0.8}

.gaiyou h1	{margin-top: 0;
	margin-bottom: 10px;
	border-bottom: dotted 2px #dddddd;
	color: #666666;
	font-size: 18px}

.gaiyou img	{width: 100%;
	height: auto;
	border: none;
	vertical-align: bottom}

.gaiyou .text	{padding: 5px 10px;
	background-color: rgba(0,0,0,0.5);
	color: #ffffff}

/* 概要のテキストを重ねる設定 */
.gaiyou a	{position: relative}

.gaiyou .text	{position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}


/* 概要２ */

.gaiyou2 a  {display: block;
           background-color: #000080;
           color: #ffffff;
           text-align: center;
           text-decoration: none}

.gaiyou2 a:hover {opacity: 0.8}

.gaiyou2 i {display: block;
           padding-top: 20px;
           padding-bottom: 10px;
           font-size: 38px}
         
.gaiyou2 .fa-database {background-color: #000080}

.gaiyou2 .fa-thumbs-o-up {background-color: #000080}

.gaiyou2 .fa-refresh {background-color: #000080}

.gaiyou2 h1 {margin-top: 0;
            margin-bottom: 0;
            padding-top: 5px;
            padding-bottom: 5px;
            font-size: 18px;
            font-weight: normal}

.gaiyou2 p {margin-top: 0;
            margin-bottom: 0;
            padding-top: 3px;
            padding-bottom: 3px;
            background-color: #778899;
            font-size: 12px}

/* 各種メニュー */
.follow ul	{margin: 0;
	padding: 0;
	list-style: none;
	width: 100%}

.follow li a	{display: block;
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 4px;
	color: #ffffff;
	font-size: 14px;
	text-decoration: none}

.follow li a:hover	{opacity: 0.8}

.follow-call  {background-color: #0000ff}
.follow-blog  {background-color: #000080}

.follow h1 {margin-top: 0;
           margin-bottom: 10px;
           padding: 5px;
           background-color: #a9a9a9;
           color: #ffffff;
           font-size: 15px}

.follow i	{margin-right: 10px;
	font-size: 24px;
	vertical-align: middle}

/* 申込みボタン */
.follow2 ul	{margin: 0;
	padding: 0;
	list-style: none;
	width: 100%}

.follow2 li a	{display: block;
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 4px;
	color: #ffffff;
	font-size: 18px;
	text-decoration: none}

.follow2 li a:hover	{opacity: 0.8}

.follow2-jinji-moushikomi {background-color: #0000ff}
.follow2-call  {background-color: #0000ff}

.follow2 h1 {margin-top: 0;
           margin-bottom: 10px;
           border-bottom: dotted 2px #dddddd;
           color: #666666;
           font-size: 20px}

.follow2 i	{margin-right: 10px;
	font-size: 24px;
	vertical-align: middle}

/* 画像メニュー */

.gmenu h1 {margin-top: 0;
       margin-bottom: 10px;
       padding: 5px;
       background-color: #778899;
       color: #ffffff;
       font-size: 15px}

.gmenu ul	{margin: 0;
	padding: 0;
	list-style: none}

.gmenu li a	{display: block;
	padding: 5px;
	border-bottom: dotted 1px #dddddd;
	background-color: #ffffff;
	color: #696969;
	font-size: 14px;
	text-decoration: none}

.gmenu li a:hover	{background-color: #eeeeee}

.gmenu li a img	{border: none}

.gmenu a:after	{content: "";
	display: block;
	clear: both}

.gmenu img	{float: left;
	width: 70px}

.gmenu .text	{float: none;
	width: auto;
	margin-left: 25px;
	padding-left: 55px}

.gmenu span	{display: block;
    padding: 5px;
	color: #b22222;
	font-size: 9px}

/* バッジ */
.badge	{width: 100px;
	height: 100px;
	padding-top: 25px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 60px;
	background-color: #00a0e9;
	font-size: 15px;
	color: #ffffff;
	text-align: center;
	box-shadow: 0 0 6px #696969}

.badge i	{display: block;
	font-size: 30px}


/* バッジの表示位置 */
.pickup	{position: relative}

.badge	{position: absolute;
	top: 45%;
	right: 60px}

/* タイトル（小見出し） */
.title {
      padding: 2px 5px;
      border-radius: 4px;
      background-color: #4682b4;
      font-size: 10px;
      color: #ffffff}

/* 続き */
.more {display: inline-block;
      padding: 5px 10px;
      border-radius: 4px;
      background-color: #4169e1;
      font-size: 10px;
      color: #ffffff}


/* 動画 */
.movie-wrap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/* ボックス1-2 上 */

.box1-2 {padding-top: 10px}

/* ボックス３ 上 */

.box3 {padding-top: 10px}

/* ボックス４ 上下 */

.box4 {padding-top: 10px}

.box4-1, .box4-2, .box4-3  {padding-bottom: 10px}


/* boxの区切り線 */

.box6 {border-top: solid 1px #dddddd}


/* コピーライト */
.copyright p	{margin: 0;
	color: #666666;
	font-size: 14px}

/* 599px以下 */
@media (max-width: 599px) {

/* バッジ */
.badge	{-ms-transform: scale(0.5);
	-ms-transform-origin: right top;
	-webkit-transform: scale(0.5);
	-webkit-transform-origin: right top;
	transform: scale(0.7);
	transform-origin: right top;
	top: 10px;
	right: 60px}
	
/* バッジの表示位置 */
.badge	{top: 40%;
	right: 22px}
	
}

/*  600px以上～767px以下  */
@media (min-width: 600px) and (max-width: 767px) {

/* バッジの表示位置 */
.badge	{top: 30%;
	right: 10px}
}


/*768px以上*/
@media(min-width:768px){

/* レイアウト横幅固定 */

.box1, .box2, .boxA, .box5
      {width: 95%;
      margin-left: auto;
      margin-right: auto}

/*box指定*/

.box1:after {content:"";
            display:block;
            clear: both}

.box1-1      {float: left;
            width: 40%}
            
.box1-2      {float: right;
            width: 55%}

.boxA:after {content:"";
              display: block;
              clear: both}
              
.box3 {float: left;
      width: 70%}

.box4 {float: right;
      width: 25%}


/* 企業紹介・横並び */

.box3-1 .shoukai {float: left;
               width: 50%}

.box3-1 .shoukai:nth-child(odd)
               {padding-right: 10px;
               -moz-box-sizing: border-box;
               -webkit-box-sizing: border-box;
               bpx-sizing: border-box;
               clear: both}

.box3-1 .shoukai:nth-child(even)
               {padding-left: 10px;
               -moz-box-sizing: border-box;
               -webkit-box-sizing: border-box;
               bpx-sizing: border-box}

}