@charset "UTF-8";

/* ========BASIC======== */
html {
    overflow-y: scroll;
}

body {
    margin: 0;
    padding: 0;
    line-height: 1.6;
    letter-spacing: 1px;
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 16px;
    color: #333;
    /* 画像ファイルの指定 */
    background-image: url(../images/background-phote.png);
    /* 画像を常に天地左右の中央に配置 */
    background-position: center center;
    /* 画像をタイル状に繰り返し表示しない */
    background-repeat: no-repeat;
    /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
    background-attachment: fixed;
    /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
    background-size: cover;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    font-weight: normal;
}

p {
    margin: 0 0 1em 0;
    padding: 0;
}

br {
    letter-spacing: normal;
}

img {
    border: 0;
}

a {
    color: #554c41;
    text-decoration: none;
}

    a:hover {
        /*color:#554c41;*/
        text-decoration: underline;
    }

dl, ol, ul {
    margin: 0 0 1em 0;
    padding: 10px;
}

li {
    margin: 0 0 0 0px; /*40*/
    padding: 0;
}

em {
    font-style: normal;
    background: #ff0;
}


/* ========TEMPLATE WIREFRAME======== */
#top {
    width: 1000px;
    margin: 0 auto;
    background: #fff;
    border-left: 1px solid #CECFCE;
    border-right: 1px solid #CECFCE;
}


#header {
    width: 1000px;
    position: relative;
}

#menu {
    z-index: 9999;
    float: left;
    width: 100%;
    margin: 0;
    background: url(../images/bg_menu.gif) 0 0 repeat-x;
}

    #menu:hover {
        background: url(../images/bg_menu.gif) 0 -60px repeat-x;
    }

#navi {
    position: absolute;
    bottom: 10px;
    right: 10px;
}


#contents {
    width: 1000px;
    clear: both;
    float: left;
    background: #f0f0f0 url(../images/bg_contents.gif) 220px 0 repeat-y;
}

#main {
    float: right;
    width: 750px;
    padding: 10px;
}

#sub {
    float: left;
    width: 220px;
}

#pageTop {
    clear: both;
}

#footMenu {
    width: 1000px;
    clear: both;
    padding: 0px 0;
    background: #2475e0;
}

#footer {
    width: 1000px;
    clear: both;
    padding: 10px 0;
}

#timetable {
    float: right;
    width: 750px;
}

/******slideshow**************/
#slideshow {
    position: relative;
    top: 48px;
    left: 3px;
    width: 1000px; /* 画像の横幅に合わせて記述 */
    height: 530px; /* 画像の高さに合わせて記述 */
}

    #slideshow img {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 8;
        opacity: 0.0;
    }

        #slideshow img.active {
            z-index: 10;
            opacity: 1.0;
        }

        #slideshow img.last-active {
            z-index: 9;
        }


/* ========HEADER CUSTOMIZE======== */
#header h1 {
    padding: 0px 0px 10px 3px;
    font-weight: bold;
    font-size: 24px;
    color: #fff;
}

#header p.description {
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 20px;
}

#header h1 a {
    color: #333;
    border-bottom: none;
    width: 1000px;
    height: 400px;
}

    #header h1 a:hover {
        color: #ddd;
    }

#graheader h1 {
    position: relative;
    padding: 0.2em 0.5em;
    background: -moz-linear-gradient(to right, rgb(251, 57, 38), #ffc994);
    background: -webkit-linear-gradient(to right, rgb(251, 57, 38), #ffc994);
    background: linear-gradient(to right, rgb(251, 57, 38), #ffc994);
    color: white;
    font-weight: lighter;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.56);
}

#navi ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    #navi ul li {
        float: left;
        margin: 0 0 0 20px;
        padding-left: 10px;
        background: #fff url(../images/bg_navi.gif) 0 6px no-repeat;
    }


/* ========MENU CUSTOMIZE======== */
#menu {
    position: relative;
    overflow: hidden;
}

    #menu ul {
        position: relative;
        left: 50%;
        float: left;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #menu li {
        position: relative;
        left: -50%; /* 各リスト項目になるli要素を左に50%移動。 */
        float: left;
        margin: 0;
        padding: 0;
    }

        #menu li + li {
            border-left: 1px solid #292828;
        }

        #menu li a {
            display: block;
            padding: 8px 20px;
            color: #fff;
            text-shadow: 1px 1px 1px gray;
            border-bottom: none;
        }

            #menu li a:hover {
                color: #fff;
                background: #09acfc;
                text-decoration: none;
            }

    #menu .current {
        background-color: #FF9A9A;
        color: #fff;
    }


/* ========MAIN CUSTOMIZE======== */
#main h2 {
    position: relative;
    padding: .15em 0.5em .15em;
    border-left: 6px solid #3498db;
}

    #main h2::after {
        position: absolute;
        left: 0;
        bottom: 0;
        content: '';
        width: 100%;
        height: 0;
        border-bottom: 1px solid #ccc;
    }

#main h3 {
    position: relative;
    padding-left: 25px
}

    #main h3::before {
        position: absolute;
        content: '';
        bottom: -3px;
        left: 0;
        width: 0;
        height: 0;
        border: none;
        border-left: solid 15px transparent;
        border-bottom: solid 15px #05abf2;
    }

    #main h3::after {
        position: absolute;
        content: '';
        bottom: -3px;
        left: 10px;
        width: 98%;
        border-bottom: solid 3px #05abf2;
    }


#main h4 {
    margin-bottom: 2px;
    padding: 0 0 0 18px;
    font-weight: bold;
    font-size: 15px;
    color: #5121000;
    line-height: 1.2;
    background: #fff url(../images/bg_h4.gif) 0 50% no-repeat;
}

#main h5 {
    margin-bottom: 2px;
    font-weight: bold;
    font-size: 14px;
    color: #5121000;
    border-bottom: 1px dotted #FB9EAE;
}

#main h6 {
    margin-bottom: 2px;
    font-weight: bold;
    font-size: 13px;
    color: #5121000;
}

#main p {
    margin-top: 10px;
    margin: 10px;
}

#main ul {
    margin-left: 30px;
}



#main dl {
    margin: 0;
    padding: 0;
}

#main dt {
    text-decoration: underline;
}

#main dd {
    margin: 0 0 1em 1em;
}

#main table {
    width: 100%;
    border-collapse: collapse;
}

    #main table th {
        padding: 5px;
        font-size: 12px;
        text-align: left;
        border: 1px solid #ddd;
        background: #f7e7d2;
    }

    #main table td {
        padding: 5px;
        # font-size:12px;
        # text-align:left;
        # border:1px solid #ddd;
    }

#main div.caption table td {
    text-align: center;
    width: 20%;
    border: 0px solid #ddd;
}

#main div.caption2 table td {
    text-align: right;
    border: 0px solid #ddd;
}

#main div.historytabel table td {
    text-align: center;
    border: 0px solid #ddd;
    color: rgb(0, 0, 0);
}

#main div.feetabel table td {
    text-align: center;
    width: 20%;
    border: 2px solid #181818;
}

#main div.schedule table {
    margin-left: 30px;
    width: 90%;
}

    #main div.schedule table td {
        text-align: center;
        width: 25%;
        border: 2px solid #181818;
    }

#main div.scope table {
    margin-left: 30px;
    width: 90%;
}

    #main div.scope table td {
        border: 2px solid #181818;
    }


#main div.executive table td {
    text-align: center;
    width: 25%;
    border: 2px solid #181818;
}

#timetable table {
    font-size: small;
    margin-left: 15px;
    width: 95%;
    border-collapse: collapse;
    line-height: 1.1;
}

    #timetable table td {
        padding: 4px;
    }

/* 申込(赤) */
.btn a {
    width: 112px;
    height: 200px;
    display: inline-block;
    padding: 0.3em 1em;
    /* border: solid 3px #4682b4; */
    border: solid 3px #ee7800;
    border-radius: 15px;
    /* background:#4682b4; */
    /* background:#ee7800; */
    background: #ffdddd;
    */ color: #FFF;
    font-size: 21px;
    font-weight: 900;
    padding: 22px;
    line-height: 20px;
}

    .btn a:hover {
        transition: all .3s;
        background: #FFF;
        color: #668ad8;
    }

/* 申込(青) */
.btn3 a {
    width: 112px;
    height: 200px;
    display: inline-block;
    padding: 0.3em 1em;
    /* border: solid 3px #4682b4; */
    border: solid 3px #8888ff;
    border-radius: 15px;
    /* background:#4682b4; */
    /* background:#ee7800; */
    background: #ddddff;
    */ color: #FFF;
    font-size: 21px;
    font-weight: 900;
    padding: 22px;
    line-height: 20px;
}

    .btn3 a:hover {
        transition: all .3s;
        background: #FFF;
        color: #668ad8;
    }

/* 申込(黄色) */
.btn4 a {
    width: 112px;
    height: 200px;
    display: inline-block;
    padding: 0.3em 1em;
    /* border: solid 3px #4682b4; */
    border: solid 3px #22ff22;
    border-radius: 15px;
    /* background:#4682b4; */
    /* background:#ee7800; */
    background: #ddffdd;
    */ color: #FFF;
    font-size: 21px;
    font-weight: 900;
    padding: 22px;
    line-height: 20px;
}

    .btn4 a:hover {
        transition: all .3s;
        background: #FFF;
        color: #668ad8;
    }

/* 申込(紫) */
.btn2 a {
    width: 112px;
    height: 200px;
    display: inline-block;
    padding: 0.3em 1em;
    /* border: solid 3px #4682b4; */
    border: solid 3px #cccc22;
    border-radius: 15px;
    /* background:#4682b4; */
    /* background:#ee7800; */
    background: #ffffaa;
    */ color: #FFF;
    font-size: 21px;
    font-weight: 900;
    padding: 22px;
    line-height: 20px;
}

    .btn2 a:hover {
        transition: all .3s;
        background: #FFF;
        color: #668ad8;
    }




/* ========SUB CUSTOMIZE======== */
#sub h2.menuDesign {
    overflow: hidden;
    align-items: center;
    background: #1175ec;
    color: #fff;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    display: flex;
}

    #sub h2.menuDesign::before,
    #sub h2.menuDesign::after {
        content: "";
        flex: 1;
        background: #fff;
        padding: 3px 0;
        height: 0;
        transform: rotate(45deg);
    }

#sub h2.infoDesign {
    position: relative;
    padding: .3em .75em;
    background-color: #1175ec;
    border-radius: 6px;
    font-size: 18px;
    color: #fff;
}

    #sub h2.infoDesign::after {
        position: absolute;
        top: 100%;
        left: 30px;
        content: '';
        width: 0;
        height: 0;
        border: 7px solid transparent;
        border-top: 7px solid #1175ec;
    }

#sub div.information ul {
    margin: 2px 0 0 0;
    padding: 0;
    list-style: none;
}

#sub div.information li {
    margin: 0 10px;
    padding-left: 10px;
    border-bottom: 3px dotted #6bb4d4;
    line-height: 1.6;
    background: url(../images/bg_list.png) 0 23% no-repeat;
}

#sub div.informationAll ul {
    margin: 5px 0 0 0;
    padding: 0;
    list-style: none;
}

#sub div.informationAll li {
    float: right;
}

    #sub div.informationAll li a:hover {
        color: #f5230f;
    }

#sub div.application ul {
    padding: 0;
}

#sub div.application li {
    position: relative;
    list-style-type: none !important; /*ポチ消す*/
    padding: 0.5em 0.5em 0.5em 0.5em;
    margin-bottom: 3px;
    margin-top: 3px;
    line-height: 1.5;
    background: #11baf0;
    vertical-align: middle;
    border-radius: 15px 0px 0px 15px; /*左側の角丸く*/
    border-bottom: solid 3px #1631de;
}

    #sub div.application li a {
        color: #ffffff;
        font-weight bold;
    }

    #sub div.application li:before { /*疑似要素*/
        display: inline-block;
        vertical-align: middle;
        /*以下白丸つくる*/
        content: '';
        width: 1em;
        height: 1em;
        background: #fff;
        border-radius: 50%;
        margin-right: 8px;
    }

    #sub div.application li a:hover {
        color: #f5230f;
    }

#sub div.guide ul {
    background: #fcfcfc; /*背景色*/
    padding: 0.5em 0.5em 0.5em 2em; /*ボックス内の余白*/
    border: solid 3px #1175ec; /*線の種類 太さ 色*/
}

#sub div.guide li {
    line-height: 1.5; /*文の行高*/
    padding: 0.2em 0; /*前後の文との余白*/
}

    #sub div.guide li a:hover {
        color: #f5230f;
        font-weight: bold;
    }


#sub div.section p {
    margin: 0px;
    padding: 0px;
    font-size: 10px;
    color: #0e41d6;
    text-align: right;
}

    #sub div.section p:hover {
        color: #f5230f;
    }

#sub div.section ul {
    padding: 0;
}

#sub div.section li {
    border-left: solid 6px #14a0e6; /*左側の線*/
    border-bottom: solid 2px #dadada; /*下に灰色線*/
    background: whitesmoke;
    margin-bottom: 5px; /*下のバーとの余白*/
    margin-top: 2px; /*上のバーとの余白*/
    line-height: 1.5;
    padding: 0.5em;
    list-style-type: none !important; /*ポチ消す*/
}

    #sub div.section li:hover {
        border-left: solid 6px #f5230f; /*左側の線*/
        border-bottom: solid 2px #dadada; /*下に灰色線*/
        background: whitesmoke;
    }

    #sub div.section li a {
        color: #404040;
        font-weight: bold;
    }

        #sub div.section li a:hover {
            color: #f5230f;
        }

/*

#sub div.section ul {
   margin:5px 0 0 0;
   padding:0;
   list-style:none;
}

#sub div.section li {
   margin:0 10px;
   padding-left:10px;
   border-bottom:3px solid #fff;
   line-height:2;
   background:url(../images/bg_list.gif) 0 50% no-repeat;
}

#sub div.section li a {
   color:#333;
}

#sub div.section li a:hover {
   color:#f5230f;
}
*/
/* ========PAGETOP CUSTOMIZE========= */
#pageTop {
    padding: 10px 0;
    text-align: right;
}

    #pageTop a {
        padding: 0 0 0 12px;
        background: url(../images/bg_pagetop.gif) 0 60% no-repeat;
    }


/* ========FOOTMENU CUSTOMIZE========= */
#footMenu {
    position: relative;
    overflow: hidden;
    padding: 5px 0 0 0;
    border-top: 1px solid #CECFCE;
}

    #footMenu ul {
        position: relative;
        left: 50%;
        float: left;
        list-style: none;
        font-size: 12px;
        margin: 0;
        padding: 0px;
    }

    #footMenu li {
        position: relative;
        left: -50%;
        float: left;
        margin: 0 20px 0 0;
        padding: 0;
    }

        #footMenu li a {
            color: #ffffff;
        }
/* ========FOOTER CUSTOMIZE======== */
#footer {
    text-align: center;
    font-size: 11px;
    padding: 20px 0;
}

/* ------------[add]------------ */
/*ヘッダー画像*/
img#topImage {
    width: 998px;
    height: 400px;
    filter: brightness(120%);
    object-fit: cover;
}

#header {
    position: relative; /*相対配置*/
}

.title {
    position: absolute; /*絶対配置*/
    color: #eb7b00; /*文字の色*/
    text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0-1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
    font-weight: bold; /*太字に*/
    font-size: 2em; /*サイズ2倍*/
    font-family: Quicksand, sans-serif; /*Google Font*/
    top: 20%;
    left: 2%;
}

.premsg {
    font-size: 18px;
    font-family: sans-serif;
}

.download{
    font-size: 18px;
    font-family: sans-serif;
}