@charset "utf-8";
/* CSS Document */

/* =================================================================== */
/* FONT
/* =================================================================== */

body {
    font-family: "Meiryo","メイリオ","MS UI Gothic","Tahoma","LucidaGrande","ヒラギノ丸ゴ Pro W4","Osaka","ＭＳ Ｐゴシック",sans-serif;
    font-size: 13px;
    line-height: 1.231;
    *font-size: small;
    *font: x-small;
}

table {
    font-size: inherit;
    font: 100%;
}

pre,code,kbd,samp,tt {
    font-family: monospace;
    *font-size: 108%;
    line-height: 100%;
}

/* IE8 */
.ie8 body{
    min-width: 700px;
}

.fontBig{
    font-size: 17px !important;
}

/* =================================================================== */









/* =================================================================== */
/* COMMON
/* =================================================================== */
*{ box-sizing: border-box;}

img{
    vertical-align: bottom;
    -ms-interpolation-mode: bicubic;
}

.bd_none{ border: none !important;}
.ta_r{ text-align: right !important;}

/* =================================================================== */









/* =================================================================== */
/* HD
/* =================================================================== */

/* NAVIGATION */
#NV{
    position: relative;
    background-color: #395da9;
    overflow: hidden;
}

#NV .btn_home{
    margin: 0;
    position: absolute;
    top: 6px;
    left: 10px;
}

#NV .btn_home a{
    display: block;
    text-decoration: none;
    padding: 6px 10px 5px 25px;
    line-height: 1;
    background: #fff url(../img/icon_home.png) 5px 3px no-repeat;
    background-size: 14px auto;
    border-radius: 3px;
    color: #004bea;
}
.ie8 #NV .btn_home a{
    background-image: url(../img/ie8_icon_home.png);
}

#NV .btn{
    display: block;
    float: right;
    margin: 0 10px;
    padding: 10px 35px 10px 10px;
    color: #fff;
    background: url(../img/menu.png) right center no-repeat;
    background-size: 30px 30px;
}
.ie8 #NV .btn{
    background-image: url(../img/ie8_menu.png);
}


#NV .wrapper{
    clear: both;
    background-color: #fff;
    padding: 5px 5px 0;
    margin: 5px;
    display: none;
}

#NV .home{
    display: inline-block;
    padding: 6px 20px 5px 35px;
    margin: 6px 0 0 8px;
    text-decoration: none;
    line-height: 1;
    font-size: 13px;
    color: #0946c7;
    border-radius: 5px;
    background: #fff url(../img/icon_home.png) 15px 4px no-repeat;
    background-size: 14px auto;
}

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

#NV h1{
    margin: 0;
    padding: 10px 0;
    font-size: 18px;
    color: #4d4d4d;
}

#NV section{
    margin-bottom: 10px;
}

#NV section h2{
    background-color: #000;
    color: #fff;
    margin: 0 0 6px;
    padding: 5px;
    font-size: 100%;
}


#NV .wrapper li{
    overflow: hidden;
    border-bottom: 1px solid;
}

#NV .wrapper li.new{
    background: url(../img/new.png) right top no-repeat;
    background-size: 35px 35px;
}
.ie8 #NV .wrapper li.new{
    background-image: url(../img/ie8_new_35.png);
}

#NV .wrapper li a{
    display: table;
    width: 100%;
    padding: 3px 0;
    color: #000;
    text-decoration: none;
    font-weight: bold;
}

#NV .wrapper li div{
    display: table-cell;
    padding: 3px 0;
    font-weight: bold;
}

#NV .wrapper .image{
    display: table-cell;
    width: 70px;
    padding-right: 10px;
}

#NV .wrapper .image img{
    width: 100%;
    height: auto;
}

#NV .wrapper .title{
    display: table-cell;
    font-size: 108%;
    vertical-align: middle;
}

#NV .prd_ct_1 h2{ background-color: #395da9;}
#NV .prd_ct_1 li{ border-color: #395da9;}

#NV .prd_ct_2 h2{ background-color: #39a9a2;}
#NV .prd_ct_2 li{ border-color: #39a9a2;}

#NV .prd_ct_3 h2{ background-color: #7ead16;}
#NV .prd_ct_3 li{ border-color: #7ead16;}


#NV .close{
    margin: 0 -5px;
    padding: 15px;
    color: #fff;
    line-height: 1;
    font-size: 18px;
    background-color: #000;
    text-align: center;
}

#NV .close img{
    margin-right: 10px;
    vertical-align: middle;
}

#NV .wrapper li span{
    color: #dd0000;
    margin: 15px;
}



/* ------ HD ------ */

.ctg_0 #NV .btn{
    color: #395DA9;
}

.ctg_0 #hd_logo{
    float: left;
    margin: 45px 0 28px 50px;
    padding: 0;
}

.ctg_0 #hd_logo img{
    width: 270px;
    height: auto;
}

.ctg_0 #hd_logo_emo{
    float: right;
    margin: 10px 50px 0;
    padding: 0;
}

.ctg_0 #hd_logo_emo img{
    width: 120px;
    height: auto;
}

#weAreHere{
    clear: both;
    margin-bottom: 20px;
}

#weAreHere h1{
    display: block;
    width: 70%;
    min-width: 300px;
    margin: 0 auto;
    padding: 6px 0;
    line-height: 0.8;
    text-align: center;
    font-size: 17px;
    color: #fff;
    border-radius: 7px;
    border: #ac1d1d 1px solid;
    background: #d60d0d;
    background: linear-gradient(to bottom, #d98f8f 0%, #d60d0d 22%);
    transition: all 0.3s ease;
}

#weAreHere h1.open{
    border-radius: 7px 7px 0 0;
    border-color: #d60d0d;
}

#weAreHere h1 img{
    width: 16px;
    height: auto;
    vertical-align: text-top;
    margin-right: 10px;
}

#weAreHere h1 span{
    font-size: 14px;
}

#weAreHere .wrapper{
    background-color: #d60d0d;
    display: none;
    padding: 10px;
}

#weAreHere .text{
    margin: 0;
    padding: 0;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 27px;
    line-height: 1;
}

#weAreHere .image{
    margin: 0;
    padding: 10px;
    text-align: center;
}

#weAreHere .image img{
    width: 100%;
    max-width: 500px;
    height: auto;
    border: #fff 2px solid;
}
.ie8 #weAreHere .image img{
    width: 496px;
    height: 326px;
}


#partners{
    margin-bottom: 20px;
}

#partners h1{
    display: block;
    width: 70%;
    min-width: 300px;
    margin: 0 auto;
    padding: 6px 0;
    line-height: 1.2;
    text-align: center;
    font-size: 15px;
    color: #fff;
    border-radius: 7px;
    border: #26556d 1px solid;
    background: #487d98;
    background: linear-gradient(to bottom, #8fb9ce 0%, #487d98 22%);
    transition: all 0.3s ease;
}

#partners h1.open{
    border: #487d98 1px solid;
    border-radius: 7px 7px 0 0;
}

#partners h1 span{
    font-size: 14px;
}


#partners > ul{
    list-style: none;
    margin: 0;
    padding: 5px;
    background-color: #487d98;
    display: none;
}

#partners a{
    color: #fff;
}

#partners img{
    display: block;
    margin: 5px auto;
    width: 120px;
    height: auto;
}

#partners ul{
    text-align: center;
    margin: 0;
    padding: 20px;
}

#partners li{
    margin: 0 2px;
    padding: 0;
    display: inline-block;
}



@media screen and (max-width: 650px){
    .ctg_0 #hd_logo{
        margin: 35px 0 38px 10px;
    }

    .ctg_0 #hd_logo img{
        width: 240px;
        height: auto;
    }

    .ctg_0 #hd_logo_emo{
        margin: 30px 10px 0;
    }

    .ctg_0 #hd_logo_emo img{
        width: 90px;
        height: auto;
    }
}


@media screen and (max-width: 479px){
    .ctg_0 #hd_logo{
        float: none;
        margin: 15px 0 8px;
        padding: 0;
        text-align: center;
    }

    .ctg_0 #hd_logo img{
        width: 200px;
        height: auto;
    }

    .ctg_0 #hd_logo_emo{
        float: none;
        margin: 0 0 20px;
        padding: 0;
        text-align: center;
    }

    .ctg_0 #hd_logo_emo img{
        width: 100px;
        height: auto;
    }
}
/* =================================================================== */









/* =================================================================== */
/* FT
/* =================================================================== */
/* TOP BTN */
.btn_toTop{
    position: fixed;
    display: block;
    right: 20px;
    bottom: 25px;
    width: 44px;
    height: 44px;
    z-index: 10000;
    display: none;
}

.btn_toTop a{
    position: relative;
    display: block;
    overflow: hidden;
    outline: none;
    width: 44px;
    height: 44px;
    border-radius: 5px;
    text-indent: -9999px;
    background: #000 url(../img/btn_top.png) center center no-repeat;
    opacity: 0.7;
    transition: all 0.2s ease;
}

.btn_toTop a:hover{
    opacity: 1;
}

#FT{
    padding: 15px 10px;
    background-color: #5f5f5f;
    color: #fff;
    text-align: right;
}

#FT p{
    margin: 0;
    padding: 0;
}
/* =================================================================== */








/* =================================================================== */
/* TOP PAGE
/* =================================================================== */

#TP_CNT > h1 span{
    display: block;
    font-weight: normal;
    font-size: 14px;
}

@media screen and (min-width: 480px){
    #TP_CNT > h1{
        margin: 0;
        padding: 15px 10px;
        border-top: #ccc 1px solid;
        background: #f2f2f2;
        background: linear-gradient(#f2f2f2, #fff);
        font-size: 19px;
    }

    #TP_CNT > section{
        padding-bottom: 10px;
        margin-bottom: 18px;
    }

    #TP_CNT > section > h1{
        margin: 0;
        padding: 13px 5px;
        color: #fff;
        font-size: 17px;
    }

    #TP_CNT > section > h1 span{
        display: block;
        font-size: 14px;
        font-weight: normal;
    }

    #TP_CNT > section > ul{
        list-style: none;
        margin: 0;
        padding: 0 10px;
        overflow: hidden;
    }

    #TP_CNT > section > ul > li{
        float: left;
        width: 48%;
        margin: 0 1%;
        padding: 10px;
        background-color: #fff;
        border: #fff 5px solid;
        border-radius: 5px;
    }

    #TP_CNT > section .image{
        width: 155px;
        margin: 0 auto;
    }

    #TP_CNT > section .image img{
        width: 100%;
        height: auto;
    }

    #TP_CNT > section .title{
        margin: 10px 0;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
    }

    #TP_CNT > section ul ul{
        list-style: none;
        margin: 3px 0 0;
        padding: 0;
    }

    #TP_CNT > section li li{
        margin: 5px 0;
        padding: 0;
    }

    #TP_CNT > section li li a{
        display: block;
        padding: 7px;
        text-align: center;
        text-decoration: none;
        background: #e9e9e9;
        background: linear-gradient(to bottom, #f9f9f9 7%, #e9e9e9 12%, #e9e9e9 100%);
        border-radius: 5px;
        border: #ccc 1px solid;
        font-size: 16px;
        color: #001fc9;
    }

    #TP_CNT > section li li span{
        display: block;
        padding: 8px 7px;
        text-align: center;
        text-decoration: none;
        background: #f8f8f8;
        border-radius: 5px;
        font-size: 16px;
        color: #d1d1d1;
    }

    #TP_CNT > section .new{
        position: relative;
    }

    #TP_CNT > section .new:after{
        content: ' ';
        position: absolute;
        top: 0;
        right: 0;
        background: url(../img/new.png) 0 0 no-repeat;
        background-size: contain;
        width: 50px;
        height: 50px;
    }


    #TP_CNT .prd_ct_1 { background-color: #395da9;}

    #TP_CNT .prd_ct_2 { background-color: #39a9a2;}

    #TP_CNT .prd_ct_3 { background-color: #7ead16;}

    #TP_CNT .secret{
        display: table;
    }

    #TP_CNT .secret div{
        text-align: center;
        display: table-cell;
        width: 100%;
        background-color: #f4f4f4;
        padding: 22px 10px;
        height: 240px;
        vertical-align: middle;
    }

    #TP_CNT .secret_text{
        font-size: 20px;
        color: #de0606;
        font-weight: bold;
    }
}


@media screen and (max-width: 650px) and (min-width: 480px){
    #TP_CNT > section > ul > li{
        float: left;
        width: 48%;
        margin: 1%;
        padding: 10px;
        background-color: #fff;
        border: #fff 5px solid;
        border-radius: 5px;
    }
}


@media screen and (max-width: 479px){
    #TP_CNT > h1{
        margin: 0;
        padding: 15px 10px;
        border-top: #ccc 1px solid;
        background: #f2f2f2;
        background: linear-gradient(#f2f2f2, #fff);
        font-size: 19px;
    }


    #TP_CNT > section{
        border-left: 5px solid;
        padding-bottom: 10px;
    }

    #TP_CNT > section > h1{
        margin: 0;
        padding: 13px 5px;
        color: #fff;
        font-size: 17px;
        background-color: #000;
    }

    #TP_CNT > section > h1 span{
        display: block;
        font-size: 14px;
        font-weight: normal;
    }

    #TP_CNT > section > ul{
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #TP_CNT > section > ul > li{
        border-bottom: #d0d0d0 1px solid;
        padding-top: 5px;
    }

    #TP_CNT > section .image{
        width: 95px;
        margin: 0 10px 0;
        display: inline-block;
        vertical-align: middle;
    }

    #TP_CNT > section .image img{
        width: 100%;
        height: auto;
    }

    #TP_CNT > section .title{
        display: inline-block;
        margin: 0;
        line-height: 1;
        font-size: 20px;
        font-weight: bold;
    }

    #TP_CNT > section ul ul{
        list-style: none;
        margin: 3px 0 0;
        padding: 0 0 10px;
        overflow: hidden;
    }

    #TP_CNT > section li li{
        width: 47%;
        float: left;
        margin: 0 1.5%;
    }

    #TP_CNT > section li li a{
        display: block;
        padding: 10px;
        text-align: center;
        text-decoration: none;
        background: #e9e9e9;
        background: linear-gradient(to bottom, #f9f9f9 7%, #e9e9e9 12%, #e9e9e9 100%);
        border-radius: 5px;
        border: #ccc 1px solid;
        font-size: 16px;
        color: #001fc9;
    }

    #TP_CNT > section li li span{
        display: block;
        padding: 11px 10px;
        text-align: center;
        text-decoration: none;
        background: #f8f8f8;
        border-radius: 5px;
        font-size: 16px;
        color: #d1d1d1;
    }

    #TP_CNT > section .new{
        background: url(../img/new.png) right 3px no-repeat;
        background-size: 50px auto;
    }


    #TP_CNT .prd_ct_1 { border-color: #395da9;}
    #TP_CNT .prd_ct_1 h1{ background-color: #395da9;}

    #TP_CNT .prd_ct_2 { border-color: #39a9a2;}
    #TP_CNT .prd_ct_2 h1{ background-color: #39a9a2;}

    #TP_CNT .prd_ct_3 { border-color: #7ead16;}
    #TP_CNT .prd_ct_3 h1{ background-color: #7ead16;}


    #TP_CNT .secret div{
        display: block;
        font-size: 18px;
        display: block;
        padding: 10px;
        margin: 10px 10px 15px;
    }


    #TP_CNT .secret_text{
        font-size: 20px;
        color: #de0606;
        font-weight: bold;
        margin: 0 0 5px;
    }
}



/* IE8 */

.ie8 #TP_CNT > h1{
    margin: 0;
    padding: 15px 10px;
    border-top: #ccc 1px solid;
    background: #f2f2f2;
    background: linear-gradient(#f2f2f2, #fff);
    font-size: 19px;
}

.ie8 #TP_CNT > section{
    padding-bottom: 10px;
    margin-bottom: 18px;
}

.ie8 #TP_CNT > section > h1{
    margin: 0;
    padding: 13px 5px;
    color: #fff;
    font-size: 17px;
}

.ie8 #TP_CNT > section > h1 span{
    display: block;
    font-size: 14px;
    font-weight: normal;
}

.ie8 #TP_CNT > section > ul{
    list-style: none;
    margin: 0;
    padding: 0 10px;
    overflow: hidden;
}

.ie8 #TP_CNT > section > ul > li{
    float: left;
    width: 32%;
    margin: 0 0.6%;
    padding: 10px;
    background-color: #fff;
    border: #fff 5px solid;
    border-radius: 5px;
}

.ie8 #TP_CNT > section .image{
    width: 155px;
    margin: 0 auto;
}

.ie8 #TP_CNT > section .image img{
    width: 100%;
    height: auto;
}

.ie8 #TP_CNT > section .title{
    margin: 10px 0;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.ie8 #TP_CNT > section ul ul{
    list-style: none;
    margin: 3px 0 0;
    padding: 0;
}

.ie8 #TP_CNT > section li li{
    margin: 5px 0;
    padding: 0;
}

.ie8 #TP_CNT > section li li a{
    display: block;
    padding: 7px;
    text-align: center;
    text-decoration: none;
    background: #e9e9e9;
    background: linear-gradient(to bottom, #f9f9f9 7%, #e9e9e9 12%, #e9e9e9 100%);
    border-radius: 5px;
    border: #ccc 1px solid;
    font-size: 16px;
    color: #001fc9;
}

.ie8 #TP_CNT > section .new{
    position: relative;
}

.ie8 #TP_CNT > section .new:after{
    content: ' ';
    position: absolute;
    top: 0;
    right: 0;
    background: url(../img/ie8_new_50.png) 0 0 no-repeat;
    background-size: contain;
    width: 50px;
    height: 50px;
}


.ie8 #TP_CNT .prd_ct_1 { background-color: #395da9;}

.ie8 #TP_CNT .prd_ct_2 { background-color: #39a9a2;}

.ie8 #TP_CNT .prd_ct_3 { background-color: #7ead16;}

.ie8 #TP_CNT .secret{
    display: table;
}

.ie8 #TP_CNT .secret div{
    text-align: center;
    display: table-cell;
    width: 100%;
    background-color: #f4f4f4;
    padding: 22px 10px;
    height: 240px;
    vertical-align: middle;
}

.ie8 #TP_CNT .secret_text{
    font-size: 20px;
    color: #de0606;
    font-weight: bold;
}





/* INFO AREA */
.info_area{
    background: url(../img/info_bc.png);
    padding: 20px 10px !important;
    border: none !important;
}

.info_area li{
    padding: 0 !important;
    margin: 5px auto !important;
    width: auto !important;
    max-width: 460px;
    float: none !important;
    border: none !important;
}

.info_area a{
    display: block;
    background-color: #fff;
    text-decoration: none;
    padding: 10px;
    font-size: 15px;
    border: #ccc 1px solid;
    border-radius: 4px;
}

.info_area a span{
    display: block;
    font-size: 12px;
}

.info_area li.pdf a{
    background: #fff url(../img/link_pdf.png) right center no-repeat;
    background-size: 70px auto;
}
.ie8 .info_area li.pdf a{
    background-image: url(../img/ie8_link_pdf.png);
}

.info_area li.blank a{
    background: #fff url(../img/link_blank.png) right center no-repeat;
    background-size: 70px auto;
}
.ie8 .info_area li.blank a{
    background-image: url(../img/ie8_link_blank.png);
}



/* PARTNER */
#newPartner{
    text-align: center;
    margin-bottom: 20px;
}

#newPartner img{
    width: 146px;
    height: auto;
}

/* =================================================================== */









/* =================================================================== */
/* PAGE
/* =================================================================== */


.ctg_page #hd_logo{
    float: left;
    margin: 15px 0 8px 20px;
    padding: 0;
}

.ctg_page #hd_logo img{
    width: 180px;
    height: auto;
}

.ctg_page #hd_logo_emo{
    float: right;
    margin: 15px 20px 15px;
    padding: 0;
}

.ctg_page #hd_logo_emo img{
    width: 80px;
    height: auto;
}



@media screen and (max-width: 479px){
    .ctg_page #hd_logo{
        margin: 15px 0 8px 20px;
    }

    .ctg_page #hd_logo img{
        width: 130px;
    }

    .ctg_page #hd_logo_emo{
        margin: 10px 20px 10px;
    }

    .ctg_page #hd_logo_emo img{
        width: 80px;
    }
}




/* ------ CONTENTS ----- */
.ctg_page #CNT{
    border-left: 5px solid;
}

.ctg_page #CNT > h1{
    color: #fff;
    margin: 0;
    padding: 20px 10px;
    font-size: 18px;
    line-height: 1;
}

.ctg_page #CNT .prd_ct{
    padding: 15px;
}

.ctg_page #CNT .prd_ct_new{
    background: url(../img/new.png) top right no-repeat;
    background-size: 100px auto;
}

.ctg_page #CNT .prd_ct h2{
    text-align: center;
    font-size: 24px;
}

.ctg_page #CNT .prd_ct .img_box{
    position: relative;
    overflow: hidden;
    min-height: 300px;
}

.ctg_page #CNT .prd_ct .image{
    text-align: center;
    position: absolute;
    top: 0;
    left: 30px;
}

.ctg_page #CNT .prd_ct .image img{
    width: 100%;
    height: auto;
    max-width: 300px;
}

.ctg_page #CNT .prd_ct .text{
    margin-left: 360px;
    margin-top: 30px;
    font-size: 123.1%;
}


.ctg_page #CNT .prd_ct p,
.ctg_page #CNT .prd_ct li{
    font-size: 14px;
    line-height: 1.5;
}

.ctg_page #CNT .prd_ct h3{
    font-size: 20px;
    border-bottom: 4px solid;
    padding: 0 0 5px 3px;
    margin: 40px 0 20px 0;
    color: #395da9;
}

.ctg_page #CNT .prd_ct > ul{
    margin: 10px;
    padding: 0 10px;
}

.ctg_page #CNT .prd_ct > ul > li{
    margin-bottom: 5px;
}


.tbl_1{
    border-collapse: collapse;
    margin: 0 auto;
}

.tbl_1 th{
    font-size: 12px;
    font-weight: bold;
}

.tbl_1 th.th_1{
    text-align: center;
    background-color: #6da6b1;
    border-right: #93bcc4 1px solid;
    color: #fff;
}

.tbl_1 th, .tbl_1 td{
    padding: 10px 20px;
}

.tbl_1 th,
.tbl_1 .td_1{
    text-align: left;
    background-color: #dff5f4;
    border-bottom: #fff 2px solid;
}

.tbl_1 th span{
    display: block;
    font-size: 12px;
    font-weight: normal;
}

.tbl_1 .td_1{
    text-align: right;
}

.tbl_1 .td_2{
    text-align: center;
    background-color: #f7f7f7;
    border-bottom: #fff 2px solid;
    border-left: #fff 1px solid !important;
}


ul.dimention{
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    text-align: center;
}

ul.dimention li{
    display: inline-block;
    max-width: 300px;
    vertical-align: middle;
    margin: 30px 0;
}

ul.dimention li img{
    height: auto;
    width: 100%;
}


.ctg_1 #CNT{ border-color: #395DA9;}
.ctg_1 #CNT > h1{ background-color: #395DA9;}

.ctg_2 #CNT{ border-color: #39a9a2;}
.ctg_2 #CNT > h1{ background-color: #39a9a2;}

.ctg_3 #CNT{ border-color: #7EAD16;}
.ctg_3 #CNT > h1{ background-color: #7EAD16;}


@media screen and (max-width: 650px){
    .ctg_page #CNT .prd_ct .image{
        position: relative;
        left: 0;
    }

    .ctg_page #CNT .prd_ct .text{
        margin-left: 0;
    }

    .ctg_page #CNT .prd_ct_new{
        background-size: 60px auto;
    }

}


@media screen and (max-width: 479px){
    .tbl_1 th, .tbl_1 td{
        padding: 10px 4px;
    }

    .tbl_1 .td_1{
        font-size: 10px;
    }
}


/* =================================================================== */