@charset "Shift_JIS";
/* =========================================================== */
/*      共通設定     */
/* =========================================================== */
/* --------- スタイルシートのリセット ------------------------ */
* {
    margin: 0;
    padding: 0;
    font: normal 15px "メイリオ";
}
/* ----------- (!)スクロールバーが出ないとき ----------------- */
/* ----------- フッターを下部に表示するのに必要な設定 -------- */
html,body {
    width: 100%;
    height: 98%;
}
/* ------------ 全体の背景 ----------------------------------- */
body {
    background-color: #f0f0f0;
}
/* ------------ リンク --------------------------------------- */
a {
    text-decoration: none;
    color: #666555;
}
a:hover {
    color: #ffffff;
}
/* ------------- リスト -------------------------------------- */
ul {
    list-style: none;
}
li {
    margin-bottom: 10px;
    color:#666666;
    line-height: 17px;
}

/* --------- コピーライトの有効年 ---------------------------- */
small time:before {
    content: "2021-2024";
}

/* =========================================================== */
/*     全体・ヘッダ・フッタ
/* =========================================================== */
/* ----------- ロゴ部分(GEOSPACE) ---------------------------  */
h1{
    padding-left: 45px;
    background-image: url("../img/logo.png");
    background-repeat: no-repeat;
    color: #333333;
    font: bold 32px "メイリオ";
}
/* ------------------- コピーライト表記部分 ------------------ */
small {
    color: #ffffff;
    font-size: 12px;
}

/* ----------------　フッター以外のコンテンツを格納する---------- */
.container {
    margin: 0 auto -22px;   /* (!)-20px(margin-bottom)はフッター用に確保 */
    width: 1200px;
    min-height: 100%;
    background-color: #ffffff;
    border-left: solid 1px #c0c0c0;
    border-right: solid 1px #c0c0c0;
}
/* ヘッダー(ロゴ部分) -------------------  */
.header {
    padding: 15px 20px 30px;
    height: 30px;
    border-bottom: solid 3px #0066cc;
}

/* フッター(コピーライト表記部分) -------- */
.footerwrap {
    clear: right;
    margin: 0 auto;
    width: 1200px;
    height: 22px;
}
.footer {
    width: 100%;
    background-color: #0066cc;
    clear: left;
    text-align: right;
}

/* =========================================================== */
/*    個別表題
/* =========================================================== */

/* カテゴリ名称 */
h2 {
    height: 100%;
    width: 100px;
    border-left: solid 10px #3366cc;
    border-bottom: solid 1px #dddddd;
    color: #333333;
    font: bold 16px "メイリオ";
    line-height: 42px;
    float: left;
}
h2 span{
    font: bold 20px "メイリオ";
}
h2:before {
    content: "　";
    font-size: 4px;
}



/* ----------------------------------------------------------- */
/* メイン(ヘッダー下部からフッター上部) -- */
.main {
    margin: 12px 25px;
    width: 1100px;
    min-height: 1200px;
}
/* ----------------------------------------------------------- */
.main li {
    padding: 2px;
    margin-left: 7px;
    margin-top: 5px;
    margin-bottom: 2px;
    width:  240px;  /*450px;*/
    height: 50px;  /*80px;*/
    background: #ffffff;
    display: table;
    float: left;
    color: #0066cc;
}

.main li a {
    padding-top: 5px;
    padding-left: 90px; /*125px;*/
    display: table-cell;
    font-size: 14px;
    vertical-align: middle;
    text-align: left;
}


/* =========================================================== */
/*    表題サイズ　と　色
/* =========================================================== */
/* ----------------------------------------------------------- */
/* ---------　サービス(青)　--------------- */
/* ----------------------------------------------------------- */
.content0{
    margin-bottom: 10px;
    width: 1155px; /*1055px;*/
    float: left;
    height:320px;
    background: #e5f2ff;
}
.content0 h2 {
    background: #add6ff;
}
/* ----------------------------------------------------------- */
/* -------------ID登録ツール（赤)-------------- */
/* ----------------------------------------------------------- */

.content1 {
    margin-bottom: 10px;
    width: 1155px; /*1055px;*/
    float: left;
    height: 70px;
    background: #ffefef;
}
.content1 h2 {
    border-left: solid 10px #cc3333;
    background: #ffc1c1;
}

/* ----------------------------------------------------------- */
/* -------問い合わせ等(オレンジ)------- */
/* ----------------------------------------------------------- */
.content2 {
    margin-bottom: 10px;
    width: 1155px; /*1055px;*/
    float: left;
    height: 70px;
    background: #ffefe0;
}
.content2 h2 {
    border-left: solid 10px #cc6633;
    background: #ffd6ad;
}

/* ----------------------------------------------------------- */
/* --------　ポータル／工事情報(紫)　-------- */
/* ----------------------------------------------------------- */
.content3 {
    margin-bottom: 10px;
    width: 1155px; /*1055px;*/
    float: left;
   height: 135px;    
   background: #f4eeff;
}
.content3 h2 {
    border-left: solid 10px #6633cc;
    background: #e5ccff;
}


/* =========================================================== */
/*   個別サイズ　と　色
/* =========================================================== */
/* ----------------------------------------------------------- */
/* リンク -------------------------------- */
/* 全体 */
/* リンクをセル化する */

/* ----------------------------------------------------------- */
/* (オレンジ) */
/* ----------------------------------------------------------- */
.geosp {
    border: solid 1px #dddddd;
    border-left: solid 7px #ffa070;
}
.geosp:hover {
    background-color: #ffa070;
    border: solid 1px #ffa070;
    border-left: solid 7px #ffa070;
}
/* ----------------------------------------------------------- */
/* (緑) */
/* ----------------------------------------------------------- */
.idoder { 
    border: solid 1px #dddddd;
    border-left: solid 7px #66cc99;
}
.idoder:hover {
    background-color: #66cc99;
    border: solid 1px #66cc99;
    border-left: solid 7px #66cc99;
}
/* ----------------------------------------------------------- */
/* (青) */
/* ----------------------------------------------------------- */
.mente {
    border: solid 1px #dddddd;
    border-left: solid 7px #5b9bd5;
}
.mente:hover {
    background-color: #5b9bd5;
    border: solid 1px #5b9bd5;
    border-left: solid 7px #5b9bd5;
}
/* ----------------------------------------------------------- */
/* (水色) */
/* ----------------------------------------------------------- */
.portal {
    border: solid 1px #dddddd;
    border-left: solid 7px #66ccff;
}
.portal:hover {
    background-color: #66ccff;
    border: solid 1px #66ccff;
    border-left: solid 7px #66ccff;
}


/* =========================================================== */
/*   アイコン（画像）の関連付け
/* =========================================================== */

#cg-geo {
    background-image:url("../img/logo.png");
    background-repeat: no-repeat;
    background-position: 20px 50%;
}
#cg-sec {
    background-image:url("../img/secure.png");
    background-repeat: no-repeat;
    background-position: 4px 25%;
}
#cg-plus {
    background-image:url("../img/cdsplus.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-chi {
    background-image:url("../img/chiban.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-cloudn {
    background-image:url("../img/cloudn.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-cloud {
    background-image:url("../img/cloud.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-nw {
    background-image:url("../img/nw.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-mail {
    background-image:url("../img/mail.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}

#cg-flets {
    background-image:url("../img/flets.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}
#cg-mail {
    background-image:url("../img/Mail.png");
    background-repeat: no-repeat;
    background-position: 4px 50%;
}