@charset "utf-8";
/* =Reset default browser CSS.
Based on work by Eric Meyer:http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
  border : 0px none;
  font-family:inherit;
  font-size:100%;
  font-style:inherit;
  font-weight:inherit;
  margin:0;
  outline:0;
  padding:0;
  vertical-align:baseline;
}
a img{
  border:0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
  display:block;
}
/* -------------------------------------------------------------- */

body{
  color : #555555;
  font : normal normal normal 12px /1.5 verdana, "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background : #ffffff;
  background-repeat : repeat;
  background-attachment : scroll;
  background-position : 0% 0%;
  background-size : auto auto;
  background-origin : padding-box;
  background-clip : border-box;
  -webkit-text-size-adjust:100%;
}
/* リンク設定
------------------------------------------------------------*/
a{
  color : #ee6055;
  text-decoration:none;
}
a:hover{
  color : #358de0;
}
a:active, a:focus{
  outline:0;
}
/* 全体
------------------------------------------------------------*/
.wrapper{
  margin:20px auto 0;
  padding:0 1%;
  width:98%;
  position:relative;
}
.inner{
  margin:0 auto;
  width:100%;
}
/*************
/* ヘッダー
*************/
#header{
  z-index:100;
  margin : 0px;
  text-align : center;
  position : relative;
}
#header::after{
  content:"";
  display: block;
  clear:both;
  visibility:hidden;
}
/*************
/* ロゴ
*************/
.logo a{
  font-size:20px;
  color : white;
  font-weight:bold;
  line-height:1;
}
.logo span{
  font-size:12px;
  font-weight:normal;
}
/**************************
/* グリッド
**************************/
.gridWrapper{
  padding-bottom:20px;
  clear:both;
  overflow:hidden;
}
.grid p{
  padding:5px 0;
  clear : both;
}
/* フッター内のグリッド(3カラム) */
#footer .grid{
  border:0;
  background:transparent;
  color : #ffffff;
}
#footer .grid p{
  padding:0;
}
/*************
メイン コンテンツ
*************/
section.content{
  padding:10px 0;
  margin-bottom:20px;
  border-radius:6px;
  overflow:hidden;
  font-size:14px;
}
section.content p{
  margin-bottom:5px;
}
/* アーカイブページ */
section.content p{
  margin-bottom:5px;
}
h3.heading{
  padding:3px 0 13px;
  margin-bottom : 25px;
  font-size:16px;
  border-bottom : 2px solid #cccccc;
  margin-top : 30px;
}

/*************
/* フッター
*************/
#footer{
  padding:20px 0;
  background-color : #6ed8c4;
  overflow : hidden;
  clear : both;
}
.tel strong{
  font-size:20px;
  font-weight:bold;
}
#footer .copyright{
  font-size:11px;
  }#footer .copyright a{
  
  color : #16bac5;
}#footer .design{
  color : #16bac5;
}
/* page navigation
------------------------------------------------------------*/
.pagenav{
  clear:both;
  width:100%;
  height:30px;
  margin:5px 0 20px;
}
.pagenav a{
  color:#555;
}
.pagenav a:hover{
  color:#a5a5a5;
}
.prev{
  float:left;
}
.next{
  float:right;
}
#pageLinks{
  clear:both;
  text-align:center;
}
/* PC用
------------------------------------------------------------*/
@media only screen and (min-width: 960px) {
    .wrapper,.inner{
        width:940px;
        padding: 0;
    }

    .wrapper{
        padding-bottom: 20px;
    }

    /* グリッド全体 */
    .gridWrapper{
        display: table;
        border-collapse: separate;
        border-spacing: 20px;
        margin-left: -20px;
        width: 980px;
    }

    /* グリッド共通 ベース:トップページ4カラム */
    .grid{
        width: 220px;
        display: table-cell;
    }

    .gridWrapper#sub{
        width: 980px;
    }

    /* サブコンテンツ + フッター グリッド(3カラム) */
    #sub .grid, #footer .grid{
        width: 300px;
    }

    /* ロゴ */
    #header .logo{
        float: left;
        padding : 0px;
        margin-top : 5px;
        margin-left : 0px;
        background-color : #ffffff;
        top : 0px;
        left : 20px;
        position : absolute;
    }

    #header .logo img{
        width : 20vw;
    }

    /* トップナビゲーション */
    nav div.panel{
        display: block !important;
    }

    a#menu{
        display: none;
    }

    #topnav{
        float: right;
        position : relative;
        right : 20px;
    }
    #topnav li{
        float: left;
        margin: 13px 5px 0;
        text-align: center;
        position: relative;
    }

    #topnav a{
        color: #555;
        font-size: 13px;
        display: block;
        padding: 25px 10px;
        line-height: 1.2;
    }

    #topnav span{
        font-size: 10px;
        color: #a5a5a5;
    }

    #topnav li.current-menu-item a,#topnav a:hover{
        background : none 0% 0% / auto auto repeat scroll padding-box border-box #f0f8ff;
    }

    #topnav ul{
        width: 160px;
        display: none;
    }

    #topnav li:hover ul{
        display: block;
        position: absolute;
        top : 65px;
        left: 0;
        z-index: 500;
    }

    #topnav li li{
        margin: 0;
        float: none;
        width: 160px;
        text-align: left;
        background : none 0% 0% / auto auto repeat scroll padding-box border-box #f0f8ff;
    }

    #topnav li li a,#topnav1 li li a{
        padding: 10px;
        border: 0;
    }

    #topnav li.current-menu-item li a,#topnav li li a{
        border-bottom-width: 1px;
    }

    #topnav li li.current-menu-item a,#topnav li li a:hover{
        padding-bottom: 10px;
        border-bottom-width: 3px;
        background : none 0% 0% / auto auto repeat scroll padding-box border-box #f0fffe;
    }

    .top-fixed{
     position : fixed;
     -webkit-box-sizing : border-box;
     box-sizing : border-box;
     z-index : 100;
     top : 0px;
     width : 100%;
     padding-top : 0px;
     margin-top : 0px;
     padding-left : 0px;
     padding-right : 0px;
     padding-bottom : 0px;
     margin-left : 0px;
     margin-right : 0px;
     margin-bottom : 0px;
     height : 105px;
     background-color : #ffffff;
    }
}
@media only screen and (max-width:959px){
  *{
  -webkit-box-sizing : border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
/* トップナビゲーション */
nav#mainNav{
  clear:both;
  width:100%;
  margin:0 auto;
  padding:0;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #f4f4f4), color-stop(0.00, #f4f4f4));
  background: -webkit-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  background: -moz-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  background: -o-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  background: -ms-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  background: linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
}
nav#mainNav a.menu{
  width:100%;
  display:block;
  height:40px;
  line-height:40px;
  font-weight: bold;
  text-align:left;
  color:#555;
}
nav#mainNav a#menu span{
  padding-left:10px;
}
nav#mainNav a span::before{
  content:"≡ ";
}
nav#mainNav a.menuOpen span::before{
  content:"× ";
}
nav#mainNav a:hover#menu{
  cursor:pointer;
}
nav .panel{
  display:none;
  width:100%;
  right:0;
  top:0;
  z-index:1;
  position : relative;
}
nav#mainNav ul{
  margin:0;
  padding:0;
}
nav#mainNav ul li{
  float:none;
  clear:both;
  width:100%;
  height:auto;
  line-height:1.2;
}
nav#mainNav ul li a,nav#mainNav ul li.current-menu-item li a{
  display: block;
  padding:15px 10px;
  text-align:left;
  border-bottom:1px dashed #e8e8e8;
  color:#555;
}
nav#mainNav ul li a span{
  padding-left:10px;
}
nav#mainNav ul li:first-child a{
  border-top:1px dashed #e8e8e8;
}
nav#mainNav ul li:last-child a{
  border:0;
}
nav#mainNav ul li li:last-child a{
  border:0;
}
nav#mainNav ul li li:last-child a{
  border-bottom:1px dashed #e8e8e8;
}
nav#mainNav ul li.current-menu-item a,nav#mainNav ul li a:hover,nav#mainNav ul li.current-menu-item a,nav#mainNav ul li a:active, nav#mainNav ul li li.current-menu-item a, nav#mainNav ul li.current-menu-item li a:hover, nav#mainNav ul li.current-menu-item li a:active{
  background:#eee;
}
nav div.panel{
  float:none;
}
nav#mainNav ul li li{
  float:left;
  border:0;
}
nav#mainNav ul li li a, nav#mainNav ul li.current-menu-item li a, nav#mainNav ul li li.current-menu-item a{
  padding-left:40px;
  background : url(sub1.png) 20px -62px / auto auto no-repeat scroll padding-box border-box transparent;
}
nav#mainNav ul li li.current-menu-item a,nav#mainNav ul li li a:hover, nav#mainNav ul li.current-menu-item li a:hover{
  background : url(sub1.png) 20px -62px / auto auto no-repeat scroll padding-box border-box #eeeeee;
}
nav#mainNav ul li li:last-child a{
  background : url(subLast.png) 20px -65px / auto auto no-repeat scroll padding-box border-box #f4f4f4;
}
nav#mainNav ul li li.current-menu-item:last-child a,nav#mainNav ul li li:last-child a:hover,nav#mainNav ul li.current-menu-item li:last-child a:hover{
  background : url(subLast.png) 20px -65px / auto auto no-repeat scroll padding-box border-box #eeeeee;
}
.grid{
  float:left;
  width:48%;
  margin:10px 2% 0 0;
}
#footer .grid, #footer .grid p{
  float:none;
  width:100%;
  text-align:center;
  border:0;
}
#footer .grid:last-child{
  padding-top:20px;
}
}
@media only screen and (max-width:768px){
  #header{
  padding-bottom:0;
}
#header .logo,#header .logo1{
  float:none;
  text-align : center;
  padding:10px 5px 20px;
}
}
@media only screen and (max-width:640px){
  #footer .grid p{
  text-align:center;
}
.grid p,#sub .grid li{
  text-align:left;
}
}
@media only screen and (max-width:480px){
#header .logo{
  float : none;
  justify-content : center;
  padding : 5px;
}

#header .logo img,#header .logo1 img{
  width : 60vw;
}
.box_tel{
  margin-left : 0px;
}
  .box__bg_transparent{
  display: block;
}
.inline-block{
  padding-left : 65%;
}
}

/*問い合わせ電話box*/
.box__bg_transparent{
    color: #555555;
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;
}
.box_tel{
  font-weight : normal;
  min-height : 16px
  padding-top : 12px;
  align-items : center;
  float : left;
  clear : left;
  text-align : center;
}

.inline-block{
  display: inline-block;      /* インラインブロック要素にする */
  padding-top : 20px;
  padding-left : 20px;
  padding-right : 20px;
  padding-bottom : 20px;
}
.tel_center{
  vertical-align : middle;
  display : table-cell;
  font-size : 16px;
  padding-top : 20px;
  padding-left : 30px;
  padding-right : 30px;
  padding-bottom : 20px;
  width: 60vw;
  height: 20vh;
  min-width: 150px;
  min-height : 150px;
  max-width: 350px;
  max-height: 300px;
  border-width : 3px;border-style : dotted;border-color : #6ed8c4;
  background-color : #f0f8ff;
}
.tel_center p{
  border-top-width : 2px;
  border-top-style : solid;
  border-top-color : #6ed8c4;
  margin-top : 0px;
  padding-top : 8px;
}

.box_tel h3{
  background-color : transparent;
  border-bottom-width : 0px;
  margin-bottom : 0px;
  text-align : center;
  font-size : 20px;
  margin-left : 5px;
  margin-top : 7px;
}
@media only screen and (max-width:660px){
.box_tel h3{
  font-size : 16px;
    }
.box_tel img{
    width : 26px;
    height : 26px;
  }
.tel_center p{
  font-size : 12px;
}
}
@media only screen and (max-width:450px){
.tel_center{
  padding-left : 20px;
  padding-right : 20px;
  width: 80vw;
}
}