@charset "UTF-8";
@import url("edit.css");
/* reset css*/
html, body, div, span, applet, object,
h1, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/** ユーチューブ埋め込み　レスポンシブ化***/
.movie-wrap {
  position: relative;
  padding-bottom: 56.25%;
  /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden; }

/** ユーチューブ埋め込み　レスポンシブ化***/
.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/** スクロールバー  **/
::-webkit-scrollbar {
  width: 5px; }

::-webkit-scrollbar-track {
  background: #A2A2A2;
  border-radius: 10px; }

::-webkit-scrollbar-thumb {
  background: #575757;
  border-radius: 10px; }

/*===============================================
解像度x992px~ CSS (PC)
===============================================*/
@media screen and (min-width: 992px) {
  /**文字の明るさ**/
  body {
    color: #5E5E5E;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300; }

  .sub_page_title {
    text-align: center;
    margin-top: 0px;
    color: white;
    text-shadow: 1px 2px 2px #050505; }

  .pc_only {
    display: block; }

  .mobile_only {
    display: none; }

  #content-page {
    background: white;
    padding-bottom: 40px;
    padding-top: 40px; }

  .br_pc::before {
    content: "\a";
    white-space: pre; }

  /*===============================================
  header グローバルナビ
  ===============================================*/
  header {
    margin: 0 auto;
    width: 100%;
    height: 76px;
    background: #ffffff;
    /* Old browsers */ }

  #mobile-h1 {
    display: none; }

  .mobail_logo {
    display: none; }

  .contact_mobile_img {
    display: none; }

  /*===============================================
  header 
  ===============================================*/
  /**option メニューに線をつける**/
  .line_left {
    border-left: 0.1rem solid #fff; }

  .logo {
    width: 20%;
    height: auto;
    float: left;
    margin-right: 3%;
    margin-top: 15px; }

  nav {
    width: 77%;
    height: auto;
    float: left;
    /**子要素 **/ }
    nav .nav_icon {
      /** 高さを合わすこと **/
      width: 100%;
      height: auto; }
    nav ul {
      list-style-type: none;
      padding: 0px;
      width: 100%;
      display: flex;
      justify-content: flex-end;
      padding-top: 15px; }
      nav ul li {
        margin: 0px;
        width: 20%;
        padding-right: 1%;
        /*background-color: #D5D4D4;*/ }
        nav ul li a {
          -webkit-transition: all 0.6s ease 0s;
          -o-transition: all 0.6s ease 0s;
          transition: all 0.6s ease 0s;
          border-bottom: 0px solid #6b6b6b;
          /**疑似タグ**/ }
          nav ul li a:hover {
            opacity: 0.7; }

  /*===============================================
  footer
  ===============================================*/
  footer {
    width: 100%;
    margin: 0 auto;
    float: left;
    background: #165686;
    background-repeat: no-repeat;
    background-position: right;
    padding: 25px 0px 0px; }
    footer h4 {
      /**footer logo*/
      margin-top: 18px; }
    footer p {
      /**font**/
      font-size: 15px;
      color: white; }
    footer ul {
      /**footer menu**/
      margin: 20px 0px 0px;
      display: flex;
      justify-content: flex-end;
      list-style: none; }
      footer ul li {
        /**footer menu ls**/
        float: left;
        margin: 0px 10px; }
        footer ul li a {
          /**footer menu a**/
          color: white;
          /**疑似タグ**/ }
          footer ul li a:hover {
            text-decoration: underline;
            color: white;
            opacity: 0.7; }

  .copyright {
    width: 100%;
    padding-left: 1%;
    margin: 0 auto 10px auto;
    text-align: left;
    color: #FFFFFF;
    clear: both;
    font-size: 12px;
    padding-bottom: 5px; }

  .footer_nav_icon {
    /** 高さを合わすこと **/
    height: 24px;
    margin: 0px 0px 30px 0px; }

  .footer_nav_icon_02 {
    /** 高さを合わすこと **/
    height: 36px;
    margin: 0px 0px 30px 0px; }

  .footer_adress {
    margin-top: 18px; }

  .footer_tel {
    margin-top: -5px;
    width: 80%; }

  #footer_navi {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 80%; }
    #footer_navi a {
      width: 33%;
      display: block;
      text-align: center; }

  /*===============================================
  基本ページ構成
  ===============================================*/
  #slidar {
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url("../images/toppage/slidar.jpg");
    background-position: bottom;
    background-size: cover;
    /**スライダー文字 */ }
    #slidar img {
      width: 50%;
      height: auto;
      margin-top: 19px;
      filter: drop-shadow(2px 2px 5px #0E2F47); }

  #slidar_pageimg {
    height: 300px;
    background-image: url("../images/page/pageimg_bg.jpg");
    background-size: cover;
    padding-top: 72px;
    /**スライダー文字 */ }
    #slidar_pageimg img {
      width: 60%;
      height: auto;
      margin-top: 19px;
      filter: drop-shadow(2px 2px 5px #0E2F47); }
    #slidar_pageimg p {
      color: white;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
      font-weight: 900;
      text-shadow: 1px 3px 3px #082337,1px 3px 3px #082337,1px 3px 3px #082337; }
    #slidar_pageimg h1 {
      font-size: 3.5em;
      font-weight: 900; }

  .denki_banae {
    width: 80%;
    height: auto;
    margin: 0% 10%;
    border: solid 1px #dcdee0; }

  .title-box {
    width: 100%;
    height: 37px;
    text-align: center;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 35px;
    font-weight: bold;
    color: #165686;
    float: left;
    margin-top: 65px; }

  .title_undergap {
    margin-bottom: 65px; }

  .title-box h2 {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 35px;
    font-weight: bold;
    color: #165686; }

  .title-boxB h2 {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 35px;
    font-weight: bold;
    color: #165686;
    text-align: center; }

  .sub-title-ms {
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 40px;
    color: #6F6F6F;
    width: 100%;
    text-align: center; }

  /*===============================================
  テーブル
  ===============================================*/
  .tablebox {
    /***  テーブル  ***/
    width: 100%; }
    .tablebox .under_line_dotted {
      /***  外枠  ***/
      border-bottom: 1px dotted #707070;
      float: left;
      width: 100%;
      /***  項目（独立）  ***/ }
      .tablebox .under_line_dotted .table_label {
        text-align: left;
        letter-spacing: 0;
        padding: 15px 10px;
        line-height: 140%;
        /***  内容（独立） ***/ }
      .tablebox .under_line_dotted .table_item {
        text-align: left;
        letter-spacing: 0;
        padding: 15px 10px;
        line-height: 140%; }

  /*===============================================
  スムーズスクロール
  ===============================================*/
  #retern {
    width: 100%; }
    #retern .page-top {
      position: fixed;
      bottom: 2%;
      right: 2%;
      height: 50px;
      width: 53px;
      margin: 0px;
      float: right;
      background-color: #165686;
      text-align: center;
      padding: 0px;
      text-decoration: none;
      border-radius: 11px;
      border: solid 2px #0E395A; }
      #retern .page-top a {
        color: #FFF;
        text-decoration: none;
        font-size: 30px; }

  /*===============================================
  お問い合わせ
  ===============================================*/
  .contactform {
    width: 100%;
    /***  子要素  ***/ }
    .contactform .under_line_dotted {
      /***  外枠  ***/
      border-bottom: 1px dotted #bdbdbd;
      float: left;
      width: 100%;
      /***  項目(独立) ***/
      /***  内容(独立) ***/ }
      .contactform .under_line_dotted .form_label {
        text-align: left;
        letter-spacing: 0;
        padding: 15px 10px;
        line-height: 140%; }
      .contactform .under_line_dotted .form_item {
        text-align: left;
        letter-spacing: 0;
        padding: 15px 10px;
        line-height: 140%; }

  .red {
    color: #ff0004; }

  .form_step {
    width: 60%;
    height: auto;
    margin: 65px 20% 15px; }

  .send_mail_icon {
    width: 30%;
    margin: 0% 35%; }

  /*===============================================
  トップページ
  ===============================================*/
  .toppage_message {
    margin-top: 36px;
    text-align: center;
    display: block;
    margin-bottom: 63px; }

  .toppage_title_buttom {
    margin-bottom: 35px; }

  .toppage_icon {
    margin-bottom: 45px; }

  .toppage_icon_02 {
    margin-bottom: 68px; }

  .toppage_icon_title {
    margin-bottom: 25px;
    color: #165686;
    font-size: 20px;
    font-weight: bold; }

  .item_title {
    margin-bottom: 25px;
    color: #165686;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin: 35px 0px 43px; }

  .item_button {
    float: right;
    width: 33%; }

  .item_button:hover {
    opacity: 0.7; }

  /*===============================================
  会社概要
  ===============================================*/
  /*===============================================
  低圧電力削減・従量電灯削減
  ===============================================*/
  .service_box {
    border: solid 1px #D5D5D5;
    border-radius: 25px;
    padding: 10px;
    box-shadow: 0px 3px 5px #E8E8E8;
    height: 438px; }

  .service_box_photo {
    width: 241px;
    height: 241px;
    margin: 0 auto; }

  .service_box_title {
    margin-bottom: 25px;
    color: #165686;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin: 25px 0px 20px; }

  .service_plan_01_section_A {
    margin-bottom: 100px; }

  /*===============================================
  高圧電力削減
  ===============================================*/
  .service_plan_02_title {
    text-align: center;
    margin: 65px 0px; }

  .service_plan_02_box {
    width: 100%;
    height: 410px;
    background-color: #165686;
    border-radius: 25px;
    padding: 4%;
    text-align: center; }

  .service_plan_02_box img {
    margin-top: 40px;
    margin-bottom: 40px; }

  .service_plan_02_box h3 {
    color: #FFF;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 20px; }

  .service_plan_02_box p {
    color: #BDD8EC; }

  .font-type_service_plan_02 {
    font-weight: bold;
    font-size: 29px;
    color: #6A6D6C; }

  .denki_info_box {
    background-color: #000000;
    opacity: 0.7;
    color: white;
    font-weight: bold;
    padding: 30px 10px 10px;
    height: 222px;
    width: 100%; }

  .denki_info_box {
    font-size: 1em; }

  .denki_info_box p.sakugen_font {
    color: yellow;
    font-size: 20px;
    font-weight: bold; }

  .service_plan_sakugen_bg01 {
    background-image: url("../images/page/hikaku_bg_01.jpg");
    background-size: cover;
    height: 656px;
    display: flex;
    align-items: flex-end;
    padding: 0; }

  .service_plan_sakugen_bg02 {
    background-image: url("../images/page/hikaku_bg_02.jpg");
    background-size: cover;
    height: 656px;
    display: flex;
    align-items: flex-end;
    padding: 0; }

  .service_plan_sakugen_bg03 {
    background-image: url("../images/page/hikaku_bg_03.jpg");
    background-size: cover;
    height: 656px;
    display: flex;
    align-items: flex-end;
    padding: 0; }

  /*===============================================
  解像度x CSS (PC)END
  ===============================================*/ }
/*===============================================
解像度x~991px CSS (SP)
===============================================*/
@media screen and (max-width: 991px) {
  /** ここに追加  **/
  /**文字の明るさ**/
  body {
    color: #5E5E5E;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300;
    font-size: 0.9em; }

  .pc_only {
    display: none; }

  .mobile_only {
    display: block; }

  #content-page {
    background: white;
    padding-bottom: 40px;
    padding-top: 40px; }

  .br_sp::before {
    content: "\a";
    white-space: pre; }

  iframe {
    /**地図高さ変更**/
    height: 300px; }

  /*===============================================
  header グローバルナビ
  ===============================================*/
  header {
    margin: 0 auto;
    width: 100%;
    height: 80px;
    background: #FFF;
    /* Old browsers */ }

  #mobile-h1 {
    display: none; }

  .mobail_logo {
    display: none; }

  .contact_mobile_img {
    display: none; }

  p {
    font-size: 0.9em; }

  /*===============================================
  header 
  ===============================================*/
  /**option メニューに線をつける**/
  .line_left {
    border-left: 0.1rem solid #fff; }

  .logo {
    width: 172px;
    height: auto;
    float: left;
    margin-left: 15px;
    margin-top: 10px; }

  header {
    width: 100%;
    height: 58px;
    z-index: 500; }

  /*===============================================
  header 
  ===============================================*/
  nav {
    width: 100%;
    height: auto;
    float: left;
    display: none;
    z-index: 500;
    position: absolute;
    top: 57px;
    background: #165686;
    /**子要素 **/ }
    nav .nav_icon {
      /** 高さを合わすこと **/
      height: 20px;
      margin: 0px 4px -4px 0px; }
    nav ul {
      list-style-type: none;
      padding: 0px;
      float: left;
      width: 100%; }
      nav ul li {
        float: left;
        width: 100%;
        padding: 15px 0% 15px 3%;
        border-bottom: 0.01em solid #2a7fbb; }
        nav ul li a {
          font-size: 0.8em;
          color: #5e5e5e;
          text-decoration: none;
          width: 100%;
          display: inline;
          font-weight: 700; }

  /*=============================
  .btn-trigger
  =============================*/
  .btn-trigger {
    position: absolute;
    width: 30px;
    height: 30px;
    cursor: pointer;
    top: 14px;
    right: 2%; }

  .btn-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #999;
    border-radius: 4px; }

  .btn-trigger, .btn-trigger span {
    display: inline-block;
    transition: all .5s;
    box-sizing: border-box; }

  .btn-trigger span:nth-of-type(1) {
    top: 0; }

  .btn-trigger span:nth-of-type(2) {
    top: 14px; }

  .btn-trigger span:nth-of-type(3) {
    bottom: 0; }

  /*=============================
  #btn01
  =============================*/
  #btn01.active span:nth-of-type(1) {
    -webkit-transform: translateY(0px) rotate(-45deg);
    transform: translateY(10px) rotate(-45deg); }

  #btn01.active span:nth-of-type(2) {
    opacity: 0; }

  #btn01.active span:nth-of-type(3) {
    -webkit-transform: translateY(0px) rotate(45deg);
    transform: translateY(-16px) rotate(45deg); }

  /*===============================================
  footer
  ===============================================*/
  footer {
    width: 100%;
    margin: 0 auto;
    float: left;
    background: #165686;
    padding: 15px 0px 0px;
    text-align: center; }
    footer h4 {
      /**footer logo*/
      margin-top: 18px;
      margin-bottom: 15px; }
    footer p {
      /**font**/
      font-size: 15px;
      color: white; }
    footer ul {
      /**footer menu**/
      margin: 20px 0px 0px;
      display: flex;
      justify-content: flex-end;
      list-style: none; }
      footer ul li {
        /**footer menu ls**/
        float: left;
        margin: 0px 10px; }
        footer ul li a {
          /**footer menu a**/
          color: white;
          /**疑似タグ**/ }
          footer ul li a:hover {
            text-decoration: underline;
            color: white;
            opacity: 0.7; }

  .copyright {
    width: 100%;
    text-align: center;
    color: #FFFFFF;
    clear: both;
    font-size: 0.7em;
    padding-bottom: 10px; }

  .footer_nav_icon {
    /** 高さを合わすこと **/
    height: 24px;
    margin: 0px 0px 30px 0px; }

  .footer_nav_icon_02 {
    /** 高さを合わすこと **/
    height: 36px;
    margin: 0px 0px 30px 0px; }

  .footer_adress {
    width: 80%;
    margin-top: 18px; }

  .footer_tel {
    margin-top: -5px;
    margin-bottom: 15px;
    width: 50%; }

  #footer_navi {
    display: none; }
    #footer_navi a {
      width: 33%;
      display: block;
      text-align: center; }

  /*===============================================
  基本ページ構成
  ===============================================*/
  #slidar {
    margin-top: 0px;
    height: 107px;
    background: #DBDBDB;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url("../images/toppage/slidar.jpg");
    background-position: center bottom;
    background-size: 100%;
    background-repeat: no-repeat;
    /**スライダー文字 */ }
    #slidar img {
      width: 60%;
      height: auto;
      margin-top: 19px; }

  #slidar_pageimg {
    margin-top: 0px;
    height: 107px;
    background: #DBDBDB;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url("../images/toppage/slidar.jpg");
    background-position: center bottom;
    background-size: 100%;
    background-repeat: no-repeat;
    /**スライダー文字 */ }
    #slidar_pageimg p {
      color: white;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
      font-weight: 900;
      text-shadow: 1px 3px 3px #082337,1px 3px 3px #082337,1px 3px 3px #082337;
      font-size: 0.3em; }
    #slidar_pageimg img {
      width: 60%;
      height: auto;
      margin-top: 50px; }

  .denki_banae {
    width: 100%;
    height: auto;
    border: solid 1px #dcdee0; }

  .title-box {
    width: 100%;
    height: 37px;
    text-align: center;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 1.5em;
    font-weight: bold;
    color: #165686;
    float: left;
    margin-top: 40px; }

  .title_undergap {
    margin-bottom: 25px; }

  .title-box h2 {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 1em;
    font-weight: bold;
    color: #165686; }

  .title-boxB h2 {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 1.4em;
    font-weight: bold;
    color: #165686;
    text-align: center; }

  .sub-title-ms {
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 40px;
    color: #6F6F6F;
    width: 100%;
    text-align: center; }

  /*===============================================
  テーブル
  ===============================================*/
  .tablebox {
    /***  テーブル  ***/
    width: 100%; }
    .tablebox .under_line_dotted {
      /***  外枠  ***/
      float: left;
      width: 100%;
      /***  項目（独立）  ***/ }
      .tablebox .under_line_dotted .table_label {
        text-align: left;
        letter-spacing: 0;
        padding: 10px 10px;
        line-height: 140%;
        background: #f5f5f5;
        /***  内容（独立） ***/ }
      .tablebox .under_line_dotted .table_item {
        text-align: left;
        letter-spacing: 0;
        padding: 10px 10px;
        line-height: 140%; }

  /*===============================================
  スムーズスクロール
  ===============================================*/
  #retern {
    width: 100%; }
    #retern .page-top {
      position: fixed;
      bottom: 2%;
      right: 2%;
      height: 50px;
      width: 53px;
      margin: 0px;
      float: right;
      background-color: #165686;
      text-align: center;
      padding: 0px;
      text-decoration: none;
      border-radius: 11px;
      border: solid 2px #0E395A; }
      #retern .page-top a {
        color: #FFF;
        text-decoration: none;
        font-size: 30px; }

  /*===============================================
  お問い合わせ
  ===============================================*/
  .contactform {
    width: 95%;
    margin: 0% 2.5%;
    /***  子要素  ***/ }
    .contactform .under_line_dotted {
      /***  外枠  ***/
      border-bottom: 1px dotted #bdbdbd;
      float: left;
      width: 100%;
      /***  項目(独立) ***/
      /***  内容(独立) ***/ }
      .contactform .under_line_dotted .form_label {
        text-align: left;
        letter-spacing: 0;
        padding: 10px 0px 0px;
        line-height: 140%; }
      .contactform .under_line_dotted .form_item {
        text-align: left;
        letter-spacing: 0;
        padding: 15px 10px;
        line-height: 140%; }

  .red {
    color: #ff0004; }

  .form_step {
    width: 95%;
    margin: 30px 2.5% 4px; }

  .send_mail_icon {
    width: 40%;
    margin: 0% 30%; }

  /*===============================================
  トップページ
  ===============================================*/
  .toppage_message {
    margin-top: 36px;
    text-align: center;
    display: block;
    margin-bottom: 63px; }

  .toppage_title_buttom {
    margin-bottom: 35px; }

  .toppage_icon {
    margin-bottom: 15px;
    height: 70px; }

  .toppage_icon_02 {
    margin-bottom: 15px;
    margin-top: 38px;
    height: 70px; }

  .toppage_icon_title {
    margin-bottom: 15px;
    color: #165686;
    font-size: 0.9em;
    font-weight: bold; }

  .item_title {
    margin-bottom: 25px;
    color: #165686;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    margin: 35px 0px 43px; }

  .item_button {
    float: right;
    width: 45%; }

  .item_button:hover {
    opacity: 0.7; }

  #index_denki_A {
    display: flex; }

  #index_denki_A-text {
    order: 1; }

  #index_denki_A-img {
    order: 0; }

  /*===============================================
  会社概要
  ===============================================*/
  /*===============================================
  低圧電力削減・従量電灯削減
  ===============================================*/
  .service_box {
    border: solid 1px #D5D5D5;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0px 2px 5px #E8E8E8,0px 2px 5px #E8E8E8;
    height: auto;
    overflow: hidden;
    text-align: center;
    margin-bottom: 15px; }

  .service_box_photo {
    width: 46%;
    height: auto;
    margin: 0 auto; }

  .service_box_title {
    margin-bottom: 25px;
    color: #165686;
    font-size: 1.3em;
    font-weight: bold;
    text-align: center;
    margin: 25px 0px 20px; }

  .service_plan_01_section_A {
    margin-bottom: 100px; }

  /*===============================================
  高圧電力削減
  ===============================================*/
  .service_plan_02_title {
    text-align: center;
    margin: 30px 0px;
    width: 70%; }

  .service_plan_02_box {
    width: 100%;
    height: auto;
    background-color: #165686;
    border-radius: 10px;
    padding: 25px 10px;
    text-align: center;
    margin-bottom: 15px; }

  .service_plan_02_box img {
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100px;
    height: auto; }

  .service_plan_02_box h3 {
    color: #FFF;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 20px; }

  .service_plan_02_box p {
    color: #BDD8EC; }

  .font-type_service_plan_02 {
    font-weight: bold;
    font-size: 1em;
    color: #6A6D6C; }

  .denki_info_box {
    background-color: #000000;
    color: white;
    font-weight: bold;
    padding: 15px;
    height: auto;
    width: 100%; }

  .denki_info_box {
    font-size: 1em; }

  .denki_info_box p.sakugen_font {
    color: yellow;
    font-size: 1em;
    font-weight: bold; }

  /*===============================================
  解像度x CSS (PC)END
  ===============================================*/ }
