@charset "UTF-8";

/** 全ページ共通 **/

/* 全般 */
* {
    padding: 0;
    margin: 0;
    -webkit-text-size-adjust: none;
    word-wrap: break-word;
}

body {
    background: transparent;
    font-size: 16px;
    font-family: "sans-serif";
}

img {
    margin: 4px 0px;
    max-width: 320px;
}

    img.emoji {
        margin: 0px;
    }

.image {
    text-align: center;
}

    .image img {
        margin: 8px 0px;
    }

.emoji-0, .emoji-1, .emoji-2, .emoji-3, .emoji-4, .emoji-5, .emoji-6, .emoji-7, .emoji-8, .emoji-9 {
    display: none;
}

/* FIX hr */
hr[style*="width: 100%"],
hr[style*="width:100%"] {
  width: 99% !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

table[height="4"] { display: none; }

/* タイトルバー */
#title-bar {
    background: #6D85A3 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAVCAYAAACHUoQEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAACdJREFUeNpi/v//fyETAwPDPzjxF078gRO/UVlg4hcqF6cYhAAIMAAlmBdBHFQ1RAAAAABJRU5ErkJggg==) repeat-x 50% 0%;
    border-bottom: 1px solid #2E3744;
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: #CDD5DF;
    margin: 0px 0px 0px -10px;
    min-height: 44px;
    padding: 10px;
    -webkit-box-sizing: border-box;
}

    #title-bar h1 {
        color: white;
        font: normal normal bold 20px/30px Helvetica;
        left: 50%;
        margin: 2px 0px 0px -24%;
        overflow: hidden;
        padding: 5px 0px;
        position: absolute;
        text-align: center;
        text-overflow: ellipsis;
        text-shadow: #2D3642 0px -1px 0px;
        top: 0px;
        white-space: nowrap;
        width: 49%;
    }

    #title-bar a {
        background: none;
        color: white;
        font: normal normal bold 12px/30px Helvetica;
        height: 30px;
        margin: 0px;
        overflow: hidden;
        position: absolute;
        text-decoration: none;
        text-overflow: ellipsis;
        text-shadow: #2E3744 0px -1px 0px;
        top: 7px;
        white-space: nowrap;
        width: auto;
    }

    #title-bar a.back {
        -webkit-border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAeCAIAAAA6iHCJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAtJJREFUeNrEV21P01AYbbtubNExBnXDbYjjZYI4BMdgEANDQoTElw/+Rw0mBs0UiSGaoJFEQEPwjRhFCW/JxrZ2Xdu1fe71bpAhCHzqupPnS5ObPOeec+5zb+lHLxao05HPiwvzr3/++J7N7FFGgaaDLe034+O+wCXyxSKET1u5+Wc98XTK39zeOzjudLmNIoAR2tlaf/Zkqm9gKNI/RBigE9dtb23MJKZj8fvuC16b3WGxsJRxOFfHeQOtH+ZnOI+XRfgEBoLAzz6fjo7ebfD4GYYhMiEdDGRAW6xOt6d7YGzl4xIL/7mgyPL044edkVt19T4EFAJEVQYud+MvOCkHc7MJ3+VrXGOzXrHeZS1s9trjOVj7tiqpONTWBRgD6BVmQFls9iMaSHnx/bu3ffEHgC2gVVqAIojKR3Iw9zLRcjVmtTnA0NydxQDg0IWvq59kYIOeZtWs9gQkagcMcgK/vLjYNXQHcEkas0AcYPdNIPr7Q/0M69B089ofavB5ZVm3OJ2cTwegzAUgxGbSe8tLS52xewjRZGabzAABZt+8mvGHBsiYNF+AAw1cXEBGNUiQqWpAlArM5MSYBXgEOl0NkLcCkxak28MRKbuDMa6KDAwAUnU8HO2Q+N0SJ3OLMCA7V1S9vt7d3tSg5LNV0ACXwOekcGfreVbVVYUqMjOvyPsH71cqkxsZ7NHFJIXBTCMONMAlEryoxAfDucyOmaOpmINyaTowrK23IyDxKbNzUIYoKU3+i37OXpCESvfGCOw11uMMcCkQke4rDlrS1coOSk2VOXftERfKtZsURmLXQUqBVqiUABgrQirc0Xp4Fv4t8kxN8dLkaJQupOVcGnTN0PuQHHlRSG1Eu9tUTLOnxZ5clclsfmK078va7/WN7axomCN2e42Xc/VEIoiiM0KePeM20DTY3M22BZtuhENW1rC/NrI3WVGTmZxSKEr7V4ABAJ+53J1I3nPjAAAAAElFTkSuQmCC) 0 8 0 14 stretch stretch;
        border-width: 0px 8px 0px 14px;
        left: 6px;
        max-width: 55px;
        padding: 0px;
        right: auto;
    }

/* ヘッダー */
#tel {
    text-align: center;
}

    #tel a {
        margin: 4px;
    }

#logo {
    line-height: 0%;
}

    #logo img {
        margin: 4px 0px;
    }
    
    #logo * {
        text-align: center;
        line-height: 100%;
    }

/* 説明 */
#description {
    padding: 4px 18px;
    white-space: normal;
    overflow: hidden;
    font-style: italic;
}

/* 本文 */
#content {
    border-bottom: #9e9e9e 1px solid;
}

/* 見出し */
.headline {
    text-align: center;
}

h2 {
    text-align: left;
    background-image: -webkit-gradient(linear, left top, left bottom,color-stop(0, rgb(121, 121, 121)),color-stop(1, rgb(204, 204, 204)));
    color: white;
    text-shadow: #666 1px 1px 0px;
    padding: 8px 8px;
    border-top: #ececec 1px solid;
    font-size: 20px;
    text-decoration: none;
}

    h2 a, h2 a:visited, a h2, a:visited h2 {
        color: white;
        text-decoration: none;
        font-size: 20px;
    }

h3 {
    text-align: left;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222222), color-stop(0.5, #444444), to(#222222));
    color: white;
    padding: 4px 8px;
    text-shadow: #666 1px 1px 0px;
    text-decoration: none;
}

    h3 a, h3 a:visited, a h3, a:visited h3 {
        color: white;
        text-decoration: none;
    }

h4 {
    text-align: left;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222222), color-stop(0.5, #555555), to(#222222));
    color: white;
    padding: 4px;
    text-decoration: none;
}

    h4 a, h4 a:visited, a h4, a:visited h4 {
        color: white;
        text-decoration: none;
    }

/* リンクリスト */
#recent-entries {
    margin-top: 8px;
}

ul.link-list {
    margin: -1px 0px 0px 0px;
    border-top: #ececec 1px solid;
}

    ul.link-list .emoji { display: none; }

    ul.link-list li {
        list-style: none;
        background-image:
             -webkit-gradient(linear, left top, left bottom,color-stop(0, rgba(255,255,255,0.4)),color-stop(0.2, rgba(255,255,255,0)),color-stop(0.8, rgba(255,255,255,0)),color-stop(1.0, rgba(0, 0, 0, 0.1))),
            url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAYAAAAmL5yKAAAAY0lEQVQoz6WSQQrAMAgEhbw/4NUHFAJ5pEUwxQQK3e1hwRxmIKvi7mJmPRIzmgV7pjOCWQSwJATtj0SyA1ryDCkZqGR7pORCJF8EinwBgs8SYbiucTDw2yEpekjKwrUDZeDIDX1qfF5mUuKSAAAAAElFTkSuQmCC);
        background-repeat: repeat, no-repeat;
        background-position: left top, 100% 50%;
    }

        ul.link-list li a {
            display: block;
            margin: 0px;
            padding: 16px 16px 16px 8px;
            text-decoration: none;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        
        ul.link-list li:nth-child(1) a {
            border-top: none;
        }

/* コンタクト */
#footer #contacts {
    margin: 8px;
}

    #footer #contacts dl dd {
        margin-left: 16px;
    }

    #footer #copyrights {
        border-top: 1px solid #ececec;
        text-align: center;
        padding: 10px 16px 16px 16px;
        font-size: 12px;
        height: 16px;
        vertical-align: middle;
        
    }

/* ボタン */
.buttons .button {
    margin: 10px;
}

    .buttons .button a {
        text-decoration: none;
        display: block;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(white), to(#E3E3E3));
        border: 1px solid #CCC;
        border-bottom-left-radius: 3px 3px;
        border-bottom-right-radius: 3px 3px;
        border-top-left-radius: 3px 3px;
        border-top-right-radius: 3px 3px;
        color: #333;
        display: block;
        font-weight: bold;
        padding: 0.5em;
        text-align: center;
        text-shadow: white 0px -1px 0px;
    }

/* メニューボタン */
ul.menu-buttons {
    overflow: hidden;
    padding: 13px 0px 0px 9px;
    list-style: none;
}

    ul.menu-buttons li {
        float: left;
        /*height: 77px;*/
        margin: 0px 8px 8px 8px;
        position: relative;
        width: 59px;
        line-height: 1.3;
        display: block;
    }
    
        ul.menu-buttons li a {
            background: url(../../images/icons/contents.png) no-repeat 0px 0px;
            -webkit-background-size: 59px 59px;
            display: block;
            height: 59px;
            width: 59px;
            color: transparent;
        }
        
        ul.menu-buttons li p {
            bottom: 0px;
            font-size: 12px;
            font-weight: bold;
            /*height: 18px;*/
            text-overflow: ellipsis;
            /*
            overflow: hidden;
            white-space: nowrap;
            */
            /*position: absolute;*/
            text-align: center;
            width: 73px;
            z-index: 10;
            margin-left: -8px;
            margin-top: 2px;
        }

/** お問い合わせページ用 **/
body.inquiry form input {
    font-size: large;
    padding: 4px;
}

body.inquiry form input[type="text"] {
    width: 90%;
    margin: 8px 3.5%;
}

body.inquiry form input[type="submit"],
body.inquiry form input[type="button"],
body.inquiry form button {
    width: 93%;
    margin: 8px 3.5%;
}

body.inquiry textarea {
    width: 90%;
    margin: 8px 3.5%;
    padding: 4px;
}

/** トップページ用 **/

/* トップページ共通 */
body.index {
}

    body.index .menu-sub {
    border-top: 1px solid #ECE9E4;
    }

    body.index #recent-entries {
    margin-top: 0px;
    }
    
    body.index .form-image {
    line-height: 0;
    text-align: center;
    margin: 4px 0;
    }
    
    body.index ul li a.has-icon {
    background-image: url(../../images/icons/contents.png);
    }

        body.index ul li.map a.has-icon {
        background-image: url(../../images/icons/map.png);
        }
        
        body.index ul li.inquiry a.has-icon {
        background-image: url(../../images/icons/inquiry.png);
        }
        
        body.index ul li.staffblog a.has-icon {
        background-image: url(../../images/icons/staffblog.png);
        }
        
        body.index ul li.sendto a.has-icon {
        background-image: url(../../images/icons/sendto.png);
        }
        
    body.index #contacts {
        padding: 8px 18px;
    }

        body.index #contacts div:nth-child(1) {
            font-weight: bold;
        }

        body.index #contacts dl {
            margin-top: 8px;
        }

            body.index #contacts dl dd {
                margin-left: 24px;
                font-size: 14px;
            }

/* パターン1用 */

/* パターン2用 */

body.index.pattern2 ul.link-list.image-list li a {
    background-repeat: no-repeat;
    background-position: 6px 50%;
    -webkit-background-size: 45px 45px;
    padding-left: 60px;
}

/* パターン3 */
body.index.pattern3 {
    background-image: url(../../images/background.jpg);
}

    body.index.pattern3 * {
        color: #444444;
    }

    body.index.pattern3 #recent-entries {
        height: 32px;
        overflow: hidden;
        background-color: rgba(255,255,255,0.6);
        border: none;
    }

        body.index.pattern3 #recent-entries ul {
            border: none;
        }

            body.index.pattern3 #recent-entries ul li {
                display: none;
            }

            body.index.pattern3 #recent-entries ul li a {
                padding: 4px 8px;
                font-size: 16px;
            }

        body.index.pattern3 #recent-entries ul li:nth-child(1) {
            display: block;
        }

    body.index.pattern3 div.float-menu {
        width: 60%;
        left: 18px;
        overflow: hidden;
        border-radius: 8px;
        -webkit-box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
        margin-top: 100px;
        margin-left: 18px;
        margin-bottom: 50px;
    }

    body.index.pattern3 div.float-menu h2 {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
        font-size: 14px;
        padding: 4px 6px;
    }

    body.index.pattern3 div.float-menu ul {
        background-color: rgba(255,255,255,0.6);
    }

    body.index.pattern3 div.float-menu li {
        height: 32px;
        font-size: 14px;
    }

        body.index.pattern3 div.float-menu li a {
            padding: 4px 16px 4px 6px;
            text-shadow: #cccccc 1px 1px 0px;
        }

    body.index.pattern3 #footer #copyrights {
        width: 100%;
        height: 16px;
        font-size: 12px;
        padding: 2px 0px 2px 0px;
        background-color: rgba(255,255,255,0.8);
    }

/* パターン4 */
body.index.pattern4 {
  margin: 0px;
  padding: 0px;
  background-color: white;
  opacity: 0;
}

  body.index.pattern4 * {
    color: #444444;
  }

  body.index.pattern4 #wrapper {
    background-color: white;
    background-position: center top;
    background-repeat: no-repeat;
    min-height: 100%;
    background-image: url(../../images/background.jpg);
    opacity: 0;
  }

  body.index.pattern4 #recent-entries {
    height: 32px;
    overflow: hidden;
    background-color: rgba(255,255,255,0.6);
    border: none;
  }

    body.index.pattern4 #recent-entries ul {
      border: none;
    }

      body.index.pattern4 #recent-entries ul li {
        display: none;
      }

        body.index.pattern4 #recent-entries ul li:nth-child(1) {
          display: block;
        }

        body.index.pattern4 #recent-entries ul li a {
          padding: 4px 8px;
          font-size: 16px;
        }

  body.index.pattern4 div.float-menu {
    width: auto;
    overflow: hidden;
    margin-top: 100px;
    margin-left: 18px;
    margin-right: 18px;
    margin-bottom: 50px;
  }

  body.index.pattern4 div.float-menu li {
    font-size: 14px;
    padding: 0px;
    background: none;
    opacity: 0.01;
  }

    body.index.pattern4 div.float-menu li a {
      padding-top: 0px;
      padding-bottom: 0px;
      line-height: 44px;
      font-size: 20px;
      color: white;
      text-shadow: #000000 2px 2px 2px;
    }

  body.index.pattern4 #footer #copyrights {
    width: 100%;
    height: 16px;
    font-size: 12px;
    padding: 2px 0px 2px 0px;
    background-color: rgba(255,255,255,0.8);
  }

/* Animations */
@-webkit-keyframes 'fade-in' {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes 'float-in' {
  from {
    opacity: 0.01;
    -webkit-transform: translateX(-200px);
    -webkit-transform: scale(2);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -webkit-transform: scale(1);
  }
}

body.index.pattern4.animation {
  opacity: 1;
}
  
  body.index.pattern4.animation #wrapper {
    -webkit-animation-name: fade-in;
    -webkit-animation-duration: 7s;
    opacity: 1;
  }

  body.index.pattern4.animation div.float-menu {
    color:#444;
    width:86%;
    left: 18px;
    overflow: hidden;
    border-radius: 8px;
    -webkit-box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
    margin-top: 100px;
    margin-left: 18px;
    margin-bottom: 50px;
  }

  body.index.pattern4 div.float-menu li.animation {
    opacity: 1;
    -webkit-animation-name: float-in;
    -webkit-animation-duration: 0.3s;
    -webkit-transition-timing-function: ease-in;
    background-color: rgba(255, 255, 255, 0.6);
    margin-top:2px;
  }
