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

/* YUI 3.9.0 (build 5827) Copyright 2013 Yahoo! Inc. http://yuilibrary.com/license/ */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}



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

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}



.pconly{display:block;}
.sponly{display:none;}


body {
    margin:0px;
    padding:0;
    line-height:1.6;
    letter-spacing:normal;
    font-family: "メイリオ", Meiryo,"Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3",sans-serif;
    font-size:12px;
    color:#333;
    background:#fff;
}


br {
   letter-spacing:normal;
}

a {
    color:#06C;
    text-decoration:none;
}

a:hover {
   color:#0172AB;
}

img {
   border:0;
   vertical-align:bottom;
}

h1,h2,h3,h4,h5,h6 {
   margin:0;
}

.clear{
    clear: both;
    line-height: 1.0em;
}
.clearB{
    clear: both;
    line-height:0;
}
.fl {float:left;}
.fr {float:right;}


/*** LAYOUT
*****************************************/

#wrapper{
    width:960px;
    margin:0 auto;
    background:#FFF;}


#header{
    padding:0 ;
    position:relative;
}

#gnavi {
   position:absolute;
   bottom:0;
   right:0;
}

#contents {
    margin: 0;
    padding: 5px 0;
    position: relative;
}

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

#main{
    float: right;
    width: 720px;
    min-height: 720px;
}

nav#sitemap{
    clear:both;
    width:960px;
    height:190px;
    margin:0 auto;
}
#footer{
    clear:both;
    width:960px;
    margin:0 auto;
    bottom:0;
}

/*** HEADER
*****************************************/

#header h1 img{float: left;}

#header #gnavi ul {
   list-style:none;

}
#header #gnavi li {
   float:left;
   margin-left:15px;
   font-size:11px;
}

#header #gnavi li a {
   display:block;
   padding-left:8px;
   background:url("img/bg_arrow.gif") 0 50% no-repeat;
}

/*** SUB-CONTENTS
*****************************************/

#sub h2 {
   padding:5px;
   font-size:14px;
   font-weight:bold;
   color:#fff;
   background:#6E6E6E;
   margin-top:5px;
}

#sub h3 {
   padding:0;
   font-size:13px;
   line-height:1.8em;
   font-weight:bold;
   color:#FFF;
   margin:0;
/*   background: #efe9de;*/
}

#sub ul {
   margin:0;
   padding:0;
   border:1px solid #EFEBEF;
   border-bottom:none;
}

#sub li {
   padding:5px;
   line-height:1.3em;
   list-style:none;
   border-bottom:1px solid #E7E7EF;
}

#sub li a {
   display:block;
   padding:5px 5px 5px 15px;
   background:url("img/bg_arrow.gif") 5px 50% no-repeat;
}

#sub li a:hover {
   display:block;
   color:#333;
   background:#EFEBEF url("img/bg_arrow.gif") 5px 50% no-repeat;
   text-decoration:none;
}

.sub_wb{ background:#2B96DA; border-left:1px solid #E7E7EF;}
.sub_orange{ background:#FED102; border-left:1px solid #E7E7EF;}
.sub_dblue{ background:#024EA3; border-left:1px solid #E7E7EF;}
.sub_green{ background:#419555; border-left:1px solid #E7E7EF;}
.sub_rgreen{ background:#9ADA00; border-left:1px solid #E7E7EF;}



/*** MENU CUSTOMIZE
*****************************************/
nav#menu ul {
   margin:0 0 1px 0;
   padding:0;
   list-style:none;
    clear: both;
}

nav#menu li {
   overflow:hidden;
   float:left;
   margin:0;
   margin-left:-1px;
   padding:0;
   border:1px solid #CECBCE;
   border-bottom:none;
   background:#fff url("img/bg_menu.gif") -40px 0 repeat-x;
}

nav#menu li a {
   display:block;
   width:159px;
   height:20px;
   padding:10px 0;
   line-height:20px;
   font-weight:bold;
   text-align:center;
   outline:none;
}

nav#menu li a:hover {
   color:#fff;
   text-decoration:none;
   background:#fff url("img/bg_menu.gif") 100% 100% repeat-x;
}

nav#menu li.home {
   width:158px;
   margin-left:0;
   border-left:1px solid #CECBCE;
}

nav#menu li.active a {
   color:#fff;
   background:#fff url("img/bg_menu.gif") 100% 100% repeat-x;
   text-decoration:none;
}

/*** MAIN CONTENTS
*****************************************/
/* TOP　INFO*/
h2.info {
    background:#0393DD;
    color:#FFF;
    line-height:1.5em;
}

#main dl.information {
   margin:0;
}
#main dl.information dt {
   float:left;
   padding-top:5px;
   padding-left:2px;
}

#main dl.information dd {
   margin:0 0 5px 0;
   padding: 5px 0px 5px 9em;
   background:url("img/bg_dotline.gif") 0 100% repeat-x;
}
#main h2 {
    background-color:#069;
    color:#FFF;
}

#main h3 {
    color:#069;
    font-size:2.0em;
    margin:15px 0 10px 0;
}

#main h4{
    color:#026699;
    font-size:1.5em;
    line-height:2.0em;
}

#main h5{
    color: #026699;
    font-size: 1.2em;
    line-height: 2em;
}

#main ul {
    text-align: center;
    margin:0;
}

#main ul li {
    float:left;
margin-top:10px;
}

#main .con ul  {
    text-align:left;
    float:none;
    margin:0;
    margin-left:20px;
}
#main .con ul li {
    margin-top: 10px;
    margin-left: 20px;
    float: none;
    list-style: none;
}

#main .con dl {
    line-height:3.0em;
    margin-left:50px;
    margin-right:50px;
    margin-top:15px;
    border-top:#C7E6F5 dotted 1px;
    border-left:#C7E6F5 dotted 1px;}

#main .con dt {
    float: left;
    width: 155px;
    margin-right: 20px;
    display: block;
    font-weight: bold;
    text-align: justify;
    text-justify: inter-ideograph;
    background-color: #FFF;
}
#main .con dd {
    text-align:start;
    display:block;
    border-bottom:#fff dotted 1px;
    background-color: #C7E6F5;
}

#main .img {
    padding-left:14px;
    padding-right:14px;
}

.top_bn img {
    padding-top:20px;
    clear:both;
}

/* テーブル */
#main table {
   font-size:12px;
}

#main table {
   width:100%;
   margin-top:10px;
   margin-bottom:20px;
   border-collapse:collapse;
   border:1px solid #999;
   border-spacing:0;
   line-height:1.8;
}

#main table th {
   padding:5px;
   border:1px solid #999;
   border-width:0 0 1px 1px;
   background:#EFEBEF;
   font-weight:bold;
   text-align:left;
}

#main table td {
   padding:5px;
   border:1px solid #999;
   border-width:0 0 1px 1px;
   text-align:left;
}

#main table td ol {
   margin:0;
   padding:0 0 0 30px;
}

#main table td li {
   margin:0;
   padding:0;
}


#main table.akiya{
    width:80% !important;
    margin:10px auto;
}


/*** TITLE
*****************************************/
h1{
    font-size: 8px;
    margin: 8px 0px;
    padding: 0px 0px;
    text-align: right;
}

h2{
    font-size:134%; /* ≒16px */
    padding:5px 10px;
    font-weight:bold;
}

h3{
    font-size:125%; /* ≒15px */
    font-weight:bold;
    color:#333;
}

h4{
    font-size:117%; /* ≒14px */
    font-weight:bold;

}

/*** PAGETOP
*****************************************/
#pageTop {
   padding:20px 0;
   text-align:right;
    clear:both;
}

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

/*** SITEMAP
*****************************************/
nav#sitemap{
    color: #666;
    border-top: #CCC solid 1px;
    border-bottom: #CCC solid 1px;
    margin-top: 30px;
    }
nav#sitemap h2 .sm {
    font-size: 117%;
    color:#666;
    background-color:
}
nav#sitemap dl {
    float: left;
    margin-left: 30px;
    font-size: 95%;
}

nav#sitemap dl dt {
    font-weight: bold;
}
nav#sitemap dl dd {
    margin-left: 20px;
}


/*** FOOTER
*****************************************/
#footer{
    font-size:84%;
    text-align:center;
    padding:10px;}


/*** class
*****************************************/

.tac{text-align:center;}
.tar{text-align:right !important;}
.fontS {font-size:85%;}
.fontSS {font-size:60%;}
.fontL {font-size:117%;}
.fl {float:left;}
.fr{float:right;}
.b_dot{border-bottom:#069 dotted 2px;}
.b_line{border-bottom:#069 solid 2px;}

/* main title部分 */
.bb_wb{border-bottom:#2B96DA solid 3px;
    border-left:#2B96DA solid 5px;
    background:url(img/sub_icon_jokaso.png) right no-repeat;}
.bb_orange{border-bottom:#FED102 solid 3px;
    border-left:#FED102 solid 5px;
    background:url(img/sub_icon_kyuin.png) right no-repeat;}
.bb_dblue{border-bottom:#024EA3 solid 3px;
    border-left:#024EA3 solid 5px;
    background:url(img/sub_icon_mizu.png) right no-repeat;}
.bb_green{border-bottom:#419555 solid 3px;
    border-left:#419555 solid 5px;
    background:url(img/sub_icon_magokoro.png) right no-repeat;}
.bb_rgreen{border-bottom: #9ADA00 solid 3px;
    border-left: #9ADA00 solid 5px;
    background:url(img/sub_icon_eco.png) right no-repeat;}

/* QA */
.haisui{background:url(img/sub_icon_mizu.png) right bottom no-repeat;}
.odei{background:url(img/sub_icon_kyuin.png) right bottom no-repeat;}
.jokaso{background:url(img/sub_icon_jokaso.png) right bottom no-repeat;}
.magokoro{background:url(img/sub_icon_magokoro.png) right bottom no-repeat;}
.eco{background:url(img/sub_icon_eco.png) right bottom no-repeat;}

.boader {
    border:#29529E solid 1px;}

.doc_dl {
    margin:10px auto;
    padding:10px;
    width:70%;
    border:#29529E solid 1px;
    background-color:#DBFAFF;
    text-align:center;}
.doc_dl img {
    vertical-align:middle;
}

/* icon */
.ic {vertical-align: middle;}
.icb {vertical-align: bottom;}

.w30p {width:239px;}

.pd_tb18 {padding:18px 0;}

/* clearfix
------------------------------------------------------------*/
.clearfix:after {
content: ".";
display: block;
visibility: hidden;
height: 0;
clear: both;
}
.clearfix {
zoom: 1;
}

.fs300{font-size:300%;}
.pd30px{padding-top:30px;}






/**************************************************************
　tablet & smartphone
**************************************************************/


@media (max-width: 767px) {

    .pconly{display:none;}
    .sponly{display:block;}

    header{
        display: block;
    }

    h1{
    font-size: 16px;
    margin: 16px 8px;
    font-weight: bold;
    text-align:inherit;
    }
    body{
        font-size: 12px;
        width: 100%;

    }

    #wrapper{
        width: 100%;
    }
    #header img{
        max-width: 100%;
        height: auto;
    }

    #contents img{max-width: 100%; height: auto;}

    #gnavi{display: none;}


    #menu{display: none;}

    #topimg img{width: 100%;height: auto;}

    p {font-size: 12px;}

    #sub{display: none;}

    #main{float: none;
    width: 94%;
    margin: 0 auto;
    display: block;
    padding-bottom: 24px;}

    #main img{max-width: 100%;height: auto;}
    nav#sitemap{
        width: 100%;
        height: auto;
        display: block;
        padding: 16px 0;
    }

    nav#sitemap dl {width: 94%;margin:0 auto 16px;float: none;font-size: 11px;}
    nav#sitemap dl dd:nth-child(1) {
    margin-left: 20px;
}
    nav#sitemap dl dd{display: inline-block;margin-left:8px;}
    ul.top_icn li{width: 50%;
    display: inline-block;}
    ul.top_icn li.pconly{display: none;}
    ul.top_icn li img{width: 100%; height: auto;}

    #main .img{padding: 0;}
    #main ul li{margin-top: 0;margin-bottom: 16px;}
    li.sptel {
        font-weight: bold;
    font-size: 28px;
    width: 100% !important;}
    li.sptel a{    color: red;}
    .top_bn img {
    padding-top: 8px;
    display: inline-block;
    width: 45%;
        height: auto;
    }

    #footer{width: 96%;padding: 24px 2% 0;}


    .doc_dl {width: 90%;}

    /** サービス **/

    #main table.akiya {
        width: 90% !important;}

    #main .con dl {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    #main .con dt {
    float:none;
    width: 100%;
        line-height: 1.8;
    }
    #main .con dt br{
        display: none;
    }
    #main dl.information dt{
        float: none;
    }
    #main dl.information dd {
    margin: 0 0 5px 0;
        padding: 5px 0px 4px 8px;}

    .w30p {
    width: 32%;
        padding: 0.5%;
        font-size: 10px;
        margin-left: 0 !important;
    }
    h3 span{display: block;}
    h3 span.fontSS{font-size: 45%;}

    .bb_wb {
    background: url(img/sub_icon_jokaso.png) right top no-repeat;
    background-size: 14%;
    }

    .bb_orange{
    background: url(img/sub_icon_kyuin.png) right top no-repeat;
    background-size: 14%;
        }
    .bb_dblue {
        background: url(img/sub_icon_mizu.png) right top no-repeat;
    background-size: 14%;
    }

    iframe{width: 100%;}

}
