﻿@charset "UTF-8";

.icon_pen {
   position: relative;
   padding-left: 35px;
}

.icon_pen:before {
   position: absolute;
   font-family: FontAwesome;
   content: "\f040";
   background: #ffca2c;
   color: white;
   font-weight: normal;
   font-size: 15px;
   border-radius: 50%;
   left: 0;
   width: 25px;
   height: 25px;
   line-height: 25px;
   text-align: center;
   top: 50%;
   -moz-transform: translateY(-50%);
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
}

@media screen and (min-width: 784px) {

/* ========　PC用のスタイル記述　======== */

html {

   overflow-y:scroll;

}



body {

   margin:0;

   padding:0;

   line-height:1.6;

   letter-spacing:1px;

   font-family:Verdana, Helvetica, sans-serif;

   font-size:13px;

   color:#333;

}



br {

   letter-spacing:normal;

}



a {

   color:#98534B;

   text-decoration:none;

}



a:hover {

   text-decoration:underline;

}



img {

   border:0;

   vertical-align:bottom;

}



h1,h2,h3,h4,h5,h6 {

   margin:0;

}

.header_nav .header_nav01 {

   display:none;

}

/* カフェ便り */
span#backnumber_button {
    position: fixed;
    bottom: 10px;
    right: 10px;
     
    border:1px solid #888888;
    padding:2pt;
    background-color: #ffb6c1;
    filter:alpha(opacity=85);
    -moz-opacity:0.85;
    -khtml-opacity: 0.85;
    opacity:0.85;
        
    text-shadow: 0 -1px 1px #FFF, -1px 0 1px #FFF, 1px 0 1px #aaa; 
    -webkit-box-shadow: 1px 1px 2px #E7E7E7;
    -moz-box-shadow: 1px 1px 2px #E7E7E7; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px;
}


/* ========TEMPLATE LAYOUT======== */

#body {

   width:780px;

   margin:0 auto;

}



#header {

   position:relative;

   width:780px;

}



#pr {

   width:780px;

}



#gnavi {

   position:absolute;

   bottom:5px;

   right:0;

}



#menu_pc {

   float:left;

   width:780px;

   margin-bottom:10px;

}

#menu_phone {

   display: none;

}

#wrapper{

   display: none;

}

#icatch {

   width:780px;

   margin:0 auto;

   background:#fff;

}



#contents {

   clear:both;

   width:780px;

   margin:0 auto;

   padding:10px 0 ;

   background:#fff;

}



#main {

   float:left;

   width:540px;

}

#main_no_sub {

   float:left;

   width:780px;

}



#sub {

   float:right;

   width:200px;

}



#info {

   float:left;

   width:385px;

}



#news {

   float:right;

   width:385px;

}



#pageTop {

   clear:both;

}



#footMenu {

   width:780px;

   clear:both;

   overflow:hidden;

   padding:10px 0;

}



#footer {

   width:780px;

   clear:both;

   padding:10px 0;

}



#signature{

   float: right;

   margin-top: 30px;

   margin-bottom: 30px;

}



/* ========HEADER CUSTOMIZE======== */

#header h1 {

   margin:0;

   padding:10px 0;

   font-size:24px;

   color:#333;

}



#header h1 a {

   color:#9B0000;

}



#header h1 a:hover {

   color:#D30000;

   text-decoration:none;

}



/* PR CUSTOMIZE */

#header #pr p {

   margin:0;

}



/* GNAVI CUSTOMIZE */

#header #gnavi ul {

   list-style:none;

}



#header #gnavi li {

   float:left;

   font-size:12px;

   margin-left:15px;

}



#header #gnavi li a {

   padding-left:15px;

   background:url(../images/bg_gnavi.gif) 0 50% no-repeat;

}





/* ========MENU CUSTOMIZE======== */

#menu_pc ul {

   float:left;

   margin:0;

   padding:0;

}



#menu_pc li {

   margin:0;

   padding:0;

   float:left;

   font-size:11px;

   color:#333;

   text-align:center;

   list-style-type:none;

}



#menu_pc li span {

   font-family:verdana;

   font-size:13px;

   color:#fff;

}



#menu_pc li a {

   display:block;

   width:111.4px;

   padding:10px 0;

   color:#FFF1A4;

   background:url(../images/bg_menu.gif) 0 100% repeat-x;

}



#menu_pc li a:hover {

   text-decoration:none;

   background:url(../images/bg_menu.gif) 100% 100% repeat-x;

}





/* ========PC用 INFO CUSTOMIZE======== */

#info h2 {

   background:#98534B;

   font-size:16px;

   color:#fff;

   padding:2px 5px 0px 5px;

   border-bottom:3px solid #823C34;

}



#info dl dt {

   clear:left;

   float:left;

   width:7em;

   padding:10px 0.5em;

}



#info dl dd {

   margin-left:0;

   padding:10px 0.5em 10px 8em;

   background:#fff url(../images/bg_info_line.gif) 0 100% repeat-x;

}





/* ========PC用 NEWS CUSTOMIZE======== */

#news p {

   margin:0;

   padding:0 0 1em 0;

}



#news h2 {

   background:#422F28;

   font-size:16px;

   color:#fff;

   padding:5px;

}





/* ========PC用 MAIN CONTENTS CUSTOMIZE======== */

#main a {

   color:#9B0000;

}



#main a:hover {

   color:#9B0000;

}



#main h2 {

   margin:0 0 10px 0;

   padding:0;

   font-size:16px;

   color:#823C34;

   line-height:1.2;

   border-bottom:3px solid #823C34;

}



#main h3 {

   margin-bottom:2px;

   padding-left:5px;

   font-size:14px;

   color:#823C34;

   line-height:1.2;

   border-left:8px solid #823C34;

}



#main h4 {

   margin-bottom:2px;

   padding:2px;

   font-size:13px;

   color:#fff;

   background:#823C34;

}



#main h5 {

   margin-bottom:2px;

   font-size:13px;

   color:#823C34;

   border-bottom:1px dotted #823C34;

}



#main h6 {

   margin-bottom:2px;

   font-size:13px;

   color:#823C34;

}



#main p {

   margin:0 0 1em 0;

}



#main dt {

   margin-bottom:3px;

}



#main dd {

   padding:0;

   margin:0 0 0.5em 1em;

   padding:3px;

   background:#FFF3EF;

}



#main_no_sub h2 {

   margin:0 0 10px 0;

   padding:0;

   font-size:16px;

   color:#823C34;

   line-height:1.2;

   border-bottom:3px solid #823C34;

}

.s_title h2 {

   margin:0 0 10px 0;

   padding:0;

   font-size:16px;

   color:#823C34;

   line-height:1.2;

   border-bottom:3px solid #823C34;

}

.line01 p {

    line-height: 36px;

    background: url("../images/bg-note_pc.png") bottom;

    margin: 0;

    padding: 0;

}

.bg_red {

    border: 1px solid #dddddd;

    background-color: #fcf8fb;

    margin: 30px 0;

    padding: 20px 40px 40px;

}



/* PC用 INFORMATION CUSTOMIZE */

* html body #main dl.information dd div {

   display:inline-block;

}



#main dl.information dt {

   margin:0;

   padding:0 0 0 10px;

   background:url(../images/bg_list.gif) 0 6px no-repeat;

}



#main dl.information dd {

   margin:0 0 1em 1em;

   padding:3px;

}



#main table {

   width:100%;

   border-collapse:collapse;

}



#main table th {

   padding:5px;

   font-size:12px;

   color:#fff;

   text-align:left;

   border:1px solid #ddd;

   background:#db7100;

}



#main table td {

   padding:5px;

   font-size:12px;

   text-align:left;

   border:1px solid #ddd;

}



#kim_pict{

   float: left;

   margin-right: 20px;

   margin-bottom: 10px;

}

/* ========PC用 SUBCONTENTS CUSTOMIZE======== */

#sub .section {

   margin-bottom:10px;

}



#sub h2 {

   font-size:14px;

   font-weight:bold;

   color:#333;

   line-height:1.2;

}



#sub ul {

   margin:5px 0 0 5px;

   padding:0;

}



#sub li {

   padding:5px 0 5px 0;

   list-style:none;

   background:url(../images/bg_sub_line.gif) 0 100% repeat-x;

}



#sub li a {

   display:block;

   width:200px;

   padding-left:12px;

   background:url(../images/bg_list.gif) 0 6px no-repeat;

}



#sub li a:hover {

   border:none;

   font-weight:bold;

   background:#FFF3EF url(../images/bg_list.gif) 0 6px no-repeat;

   text-decoration:none;

}





/* ========PC用 PAGETOP CUSTOMIZE======== */

#pageTop {

   padding:10px 0;

   text-align:right;

}



#pageTop a {

   padding:0 0 0 12px;

   background:url(../images/bg_pagetop.gif) 0 60% no-repeat;

}





/* ========PC用 FOOTMENU CUSTOMIZE========= */

#footMenu {

   position:relative;

   padding:20px 0 0 0;

   border-top:1px solid #CECFCE;

}



#footMenu ul {

   position:relative;

   left:50%;

   float:left;

   margin:0;

   padding:0;

   list-style:none;

}



#footMenu li {

   position:relative;

   left:-50%;

   float:left;

   margin:0 20px 0 0;

   padding:0;

   font-size:12px;

}





/* ========PC用 FOOTER CUSTOMIZE======== */

#footer {

   text-align:center;

   padding:20px 0;

}



.copyright {

   font-size:11px;

}



/* --- PC用　ボックス --- */

div.section {

width: 100%; /* ボックスの幅 */

height: 250px; /* ボックスの高さ */

background-color: #ffffff; /* ボックスの背景色 */

border: 1px #c0c0c0 solid; /* ボックスの境界線 */

margin-bottom: 20px;

}

div.topics {
   background-color: #ffffff; /* ボックスの背景色 */
   border: 1px #c0c0c0 solid; /* ボックスの境界線 */
   margin-bottom: 20px;
   padding: 20px;
}




/* --- PC用　見出し --- */

div.section h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -0.9em 0 0 3px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}

div.topics h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -2.5em 0 0 1px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}

/* --- PC用　ボックス内の段落 --- */

div.section p {

margin: 1em 10px; /* 段落のマージン（上下、左右） */

}



}



@media screen and (max-width: 783px) {

/* ======== タブレット用のスタイル記述 ======== */

img, object, embed {

   max-width: 100%;

   height: auto;

}

img {

   -ms-interpolation-mode: bicubic;

}

#menu_pc {

   float:left;

   width:780px;

   margin-top:  0px;

   margin-bottom:20px;

}

#menu_phone {

   display: none;

}

#wrapper{

   display: none;

}



#header {

   background: none;

   width:100%;

   height:103px;

}

#header_inner {

   width: 738px;

   height: 103px;

   margin: 0px auto 0px;

   position: relative;

}

#header h1 {

    margin: 0;

    padding: 10px 0;

    font-size: 24px;

    color: #333;

}

.logo {

   width: 238px;

   height: 33px;

   position: absolute;

   bottom:18px;

   left:0px;

}

.pc {

   display: block;

}

.phone {

   display: none;

}

.header_nav {

   width: 230px;

   height: 16px;

   position: absolute;

   top: 15px;

   right: 220px;

}

.header_nav li {

   float: left;

}

.header_nav .header_nav01 {

   margin-right:20px;

}

.header_nav .header_nav01 {

   display:none;

}

.header_nav li a {

   background: url(../images/common/arr.png) no-repeat left center;

   padding-left:18px;

   font-size:84%

}

.header_search {

   width: 210px;

   height: 25px;

   position: absolute;

   top: 15px;

   right: 0px;

}

.h_search_style {

   width: 150px;

   height: 25px;

   float: left;

   padding-left: 10px;

   padding-right: 10px;

   border-style: none;

   line-height: 25px;

   color: #C3C3C3;

   font-size:84%;

   background: url(../images/common/search_box.png) no-repeat;

}

.h_submit_style {

   width: 40px;

   height: 25px;

   float: left;

   border-style: none;

   text-indent: -9999px;

   background: url(../images/common/search_btn.png) no-repeat;

}

.header_info {

   width: 453px;

   height: 36px;

   position: absolute;

   right: 0px;

   bottom: 15px;

}

.header_info li {

   float: left;

}

.header_tel {

   width:223px;

   height:36px;

   margin-right:20px;

}

.header_infobtn a {

   background: url(../images/common/header_contact.png) no-repeat 0px 0px;

   height: 0px;

   width: 210px;

   padding-top: 36px;

   overflow: hidden;

   float:left;

}

.header_infobtn a:hover {

   background: url(../images/common/header_contact.png) no-repeat 0px -36px;

}



/* ======== タブレット MENU CUSTOMIZE======== */

#menu_pc ul {

   float:left;

   margin:0;

   padding:0;

}



#menu_pc li {

   width:106px;

   margin:0;

   padding:0;

   float:left;

   font-size:11px;

   color:#333;

   text-align:center;

   list-style-type:none;

}



#menu_pc li span {

   font-family:verdana;

   font-size:13px;

   color:#fff;

}



#menu_pc li a {

   display:block;

   width:130px;

   padding:10px 0;

   color:#FFF1A4;

   background:url(../images/bg_menu.gif) 0 100% repeat-x;

}



#menu_pc li a:hover {

   text-decoration:none;

   background:url(../images/bg_menu.gif) 100% 100% repeat-x;

}



/* ======== タブレット用 INFO CUSTOMIZE======== */

#info h2 {

   background:#98534B;

   font-size:16px;

   color:#fff;

   padding:2px 5px 0px 5px;

   border-bottom:3px solid #823C34;

}



#info dl dt {

   clear:left;

   float:left;

   width:7em;

   padding:10px 0.5em;

}



#info dl dd {

   margin-left:0;

   padding:10px 0.5em 10px 8em;

   background:#fff url(../images/bg_info_line.gif) 0 100% repeat-x;

}

#info p {

   margin-top: 2em;

}



#main {

   width: 100%;

   background: url(../images/common/main_bg.png) repeat-x center top;

}

#main_bg {

   background: url(../images/common/main_img.jpg) no-repeat left top;

   background-size: contain;

   width: 738px;

   height: 253px;

   margin-right: auto;

   margin-left: auto;

   position:relative;

}

#main_bg h2 {

   width: 586px;

   height: 133px;

   position:absolute;

   top:70px;

   left:0px;

}

.phone_main {

   display:none;

}

#main_no_sub h2 {

   margin:0 0 10px 0;

   padding:0;

   font-size:16px;

   color:#823C34;

   line-height:1.2;

   border-bottom:3px solid #823C34;

}

#main_no_sub p{

   margin-top: 20px;

   font-size: 14px;

   line-height: 150%;

}

#kim_pict{

   float: left;

   margin-right: 20px;

   margin-bottom: 10px;

   height: auto;

}

#slideshow {

   margin: 20px;

}

#nav {

   background: url(../images/tablet/nav_bg.png) repeat-x left top;

   width: 100%;

   height: 60px;

   margin-bottom:30px;

}

#nav ul {

   width: 738px;

   height: 60px;

   margin-right: auto;

   margin-left: auto;

}

#nav ul li {

   height: 60px;

   float: left;

}

#nav ul .nav01, #nav ul .nav03, #nav ul .nav04, #nav ul .nav05, #nav ul .nav06, #nav ul .nav07, #nav ul .nav08 {

   width:105px;

}

#nav ul .nav02 {

   width:107px;

}

#nav ul a {

   background:url(../images/tablet/nav.png) no-repeat;

   height: 0px;

   display: block;

   overflow: hidden;

   padding-top: 60px;

   line-height: 60px;

}

#nav ul .nav01 a {

   background-position: 0px 0px;

   width:105px;

}

#nav ul .nav02 a {

   background-position: -105px 0px;

   width:107px;

}

#nav ul .nav03 a {

   background-position: -212px 0px;

   width:105px;

}

#nav ul .nav04 a {

   background-position: -317px 0px;

   width:105px;

}

#nav ul .nav05 a {

   background-position: -423px 0px;

   width:105px;

}

#nav ul .nav06 a {

   background-position: -528px 0px;

   width:105px;

}

#nav ul .nav07 a {

   background-position: -633px 0px;

   width:106px;

}

#nav ul .nav08 a {

   background-position: -633px 0px;

   width:106px;

}

#nav ul .nav01c a, #nav ul .nav01 a:hover {

   background-position: 0px -60px;

   width:105px;

}

#nav ul .nav02c a, #nav ul .nav02 a:hover {

   background-position: -105px -60px;

   width:107px;

}

#nav ul .nav03c a, #nav ul .nav03 a:hover {

   background-position: -212px -60px;

   width:105px;

}

#nav ul .nav04c a, #nav ul .nav04 a:hover {

   background-position: -317px -60px;

   width:105px;

}

#nav ul .nav05c a, #nav ul .nav05 a:hover {

   background-position: -423px -60px;

   width:105px;

}

#nav ul .nav06c a, #nav ul .nav06 a:hover {

   background-position: -528px -60px;

   width:105px;

}

#nav ul .nav07c a, #nav ul .nav07 a:hover {

   background-position: -633px -60px;

   width:106px;

}

#nav ul .nav08c a, #nav ul .nav08 a:hover {

   background-position: -633px -60px;

   width:106px;

}

#contents {

   width: 738px;

   margin-right: auto;

   margin-left: auto;

   margin-bottom: 20px;

   overflow:hidden;

}

#content_left {

   width: 487px;

   float: left;

}

.service_box {

   width: 487px;

   margin-bottom:25px;

}

.service_box .head {

   background: url(../images/tablet/ttl_bg01.png) no-repeat;

   width: 448px;

   height: 40px;

   padding-top: 10px;

   padding-right: 20px;

   padding-left: 20px;

}

.service_box .head h1 {

   background: url(../images/tablet/service_ttl.png) no-repeat;

   width: 136px;

   height: 0px;

   float: left;

   overflow: hidden;

   padding-top: 25px;

}

.service_box .head span {

   width: 185px;

   height: 25px;

   float: right;

}

.service_box .head span a {

   background: url(../images/tablet/service_btn.png) no-repeat 0px 0px;

   width: 185px;

   height: 0px;

   overflow: hidden;

   display:block;

   padding-top: 25px;

}

.service_box .head span a:hover {

   background: url(../images/tablet/service_btn.png) no-repeat 0px -25px;

}

.service_box .inner {

   width: 448px;

   border-bottom: 1px solid #E8E8E8;

   border-left: 1px solid #E8E8E8;

   border-right: 1px solid #E8E8E8;

   padding:20px 19px 15px 19px;

}

.service_box .inner_phone {

   display:none;

}

/* jcarousel */

.jcarousel-skin-tango .jcarousel-direction-rtl {

   direction: rtl;

}

.jcarousel-skin-tango .jcarousel-container-horizontal {

   width:448px;

   overflow:hidden;

}

.jcarousel-clip .jcarousel-clip-horizontal {

   width:448px;

}

.jcarousel-skin-tango .jcarousel-item {

   width: 210px;

   margin-right: 28px;

}

.jcarousel-skin-tango .jcarousel-item dl a {

   background: url(../images/common/arr.png) no-repeat scroll left center;

   color: #0080CC;

   font-weight: bold;

   padding-left: 18px;

}

.jcarousel-skin-tango .jcarousel-next-horizontal {

   background: transparent url(../images/tablet/arr_right.png) no-repeat 0 0;

   width: 30px;

   height: 60px;

   cursor: pointer;

   position: absolute;

   top: 45px;

   right: 0px;

}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {

   background-image: url(../images/tablet/arr_left.png);

   left: 0px;

   right: auto;

}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {

   background-position: -30px 0;

}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {

   background-position: -60px 0;

}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal, .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover, .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {

   cursor: default;

   background-position: -90px 0;

}

.jcarousel-skin-tango .jcarousel-prev-horizontal {

   background: transparent url(../images/tablet/arr_left.png) no-repeat 0 0;

   width: 30px;

   height: 60px;

   cursor: pointer;

   position: absolute;

   top: 45px;

   left: 0px;

}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {

   background-image: url(../images/tablet/arr_right.png);

   left: auto;

   right: 0px;

}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {

   background-position: -30px 0;

}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {

   background-position: -60px 0;

}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal, .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover, .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {

   background-position: -90px 0;

   cursor: default;

}

.works_box {

   width: 447px;

   margin-bottom:25px;

}

.works_box .head {

   background: url(../images/tablet/ttl_bg01.png) no-repeat;

   width: 448px;

   height: 40px;

   padding-top: 10px;

   padding-right: 20px;

   padding-left: 20px;

}

.works_box .head h1 {

   background: url(../images/tablet/works_ttl.png) no-repeat;

   width: 136px;

   height: 0px;

   overflow: hidden;

   float: left;

   padding-top: 25px;

}

.works_box .head span {

   height: 25px;

   width: 185px;

   float: right;

}

.works_box .head span a {

   background: none;

   width: 185px;

   height: 0px;

   overflow: hidden;

   display:block;

   padding-top: 25px;

}

.works_box .head span a:hover {

   background: none;

}

.works_box .inner {

   width: 448px;

   border-bottom: 1px solid #E8E8E8;

   border-left: 1px solid #E8E8E8;

   border-right: 1px solid #E8E8E8;

   padding:20px 19px 15px 19px;

}

.works_left {

   width: 198px;

   height: 98px;

   float: left;

   overflow:hidden;

}

.works_right {

   width: 228px;

   float: right;

}

.works_right li a {

   background: none;

   padding-left:18px;

   color:#0080cc;

   font-weight:bold;

}

.news_box {

   width: 700px;

}

.news_box .head {

   background: none;

   width: 448px;

   height: 40px;

   padding-top: 10px;

   padding-right: 20px;

   padding-left: 20px;

}

.news_box .head h1 {

   background: none;

   width: 136px;

   height: 0px;

   float: left;

   overflow: hidden;

   padding-top: 25px;

}

.news_box .head span {

   width: 143px;

   height: 25px;

   float: right;

}

.news_box .head span a {

   background: none;

   width: 143px;

   height: 0px;

   overflow: hidden;

   display:block;

   padding-top: 25px;

}

.news_box .head span a:hover {

   background: none;

}

.news_box .inner {

   background:#FAFAFA;

   border-bottom: 1px solid #E8E8E8;

   border-left: 1px solid #E8E8E8;

   border-right: 1px solid #E8E8E8;

   width: 448px;

   padding:5px 19px 15px 19px;

}

.news_box .inner dl {

   width: 448px;

   float: left;

   border-bottom: 1px dotted #999999;

   margin-bottom:10px;

}

.news_box .inner dt {

   width: 448px;

   float: left;

   line-height: 20px;

   margin-top: 15px;

   padding-left: 80px;

   color: #666666;

}

.news_box .inner dd {

   width: 448px;

   float: left;

   line-height: 35px;

}

.tag_recruit {

   background: none;

}

.tag_news {

   background: none;

}

.tag_works {

   background: none;

}

#content_right {

   width: 230px;

   float: right;

}

#aside {

   width: 230px;

   margin-bottom: 15px;

}

#aside h1 {

   background: none;

   width: 230px;

   height: 0px;

   overflow: hidden;

   padding-top: 44px;

   margin-bottom: 1px;

}

.aside_inner {

   background: #F3F3F3;

   width: 210px;

   padding: 20px 10px 15px 10px;

   margin-bottom: 1px;

}

.aside_inner ul {

   width: 210px;

}

.aside_inner ul li {

   width: 210px;

   margin-bottom: 1px;

}

.aside_inner ul li a {

   background: none;

   width: 190px;

   height: 30px;

   display: block;

   line-height: 30px;

   padding-left: 20px;

}

.side_ttl01 {

   background: none;

   width: 210px;

   height: 0px;

   overflow: hidden;

   padding-top: 20px;

   margin-bottom:15px;

}

.side_ttl02 {

   background: none;

   width: 210px;

   height: 0px;

   overflow: hidden;

   padding-top: 20px;

   margin-bottom:15px;

}

.side_ttl03 {

   background: none;

   width: 210px;

   height: 0px;

   overflow: hidden;

   padding-top: 20px;

   margin-bottom:15px;

}

.banner_box {

   width:220px;

}

.banner01 a {

   background: none;

   height: 0px;

   width: 230px;

   padding-top: 82px;

   overflow: hidden;

   display: block;

   margin-bottom:10px;

}

.banner01 a:hover {

   background: none;

}

.banner02 a {

   background: none;

   height: 0px;

   width: 230px;

   padding-top: 55px;

   overflow: hidden;

   display: block;

}

.banner02 a:hover {

   background: none;

}

#pageTop {

   margin-top: 20px;

   float: right;

   margin-right: 10px;

}

#footer {

   background: none;

   width: 100%;

   height: 80px;

   margin-top: 70px;

}

#footer_inner {

   width: 738px;

   height: 80px;

   margin-right: auto;

   margin-left: auto;

   position: relative;

}

.footer_logo {

   width: 211px;

   height: 30px;

   position: absolute;

   top: 10px;

   left: 0px;

}

.footer_nav {

   position: absolute;

   top: 18px;

   right: 0;

}

.footer_nav li {

   float:left;

}

.footer_nav .nav_sp {

   margin-right:15px;

}

.footer_nav li a {

   color:#FFF;

}

.footer_navbottom {

   position: absolute;

   bottom: 3px;

   left: 0px;

}

.footer_navbottom li {

   float:left;

}

.footer_navbottom li a {

   background: url(../images/common/arr_w.png) no-repeat left center;

   padding-left:18px;

   font-size:84%;

   color:#FFF;

}

#footer_inner small {

   width: 289px;

   height: 12px;

   position: absolute;

   right: 0;

   bottom: 10px;

}

.arr {

   background: url(../images/common/arr.png) no-repeat left center;

   padding-left:18px;

}

.line01 p{

   line-height: 36px;

   background: url("../images/bg-note_pc.png") bottom;

   height: 50%;

   margin: 0;

   padding: 0;

}

.bg_red {

    border: 1px solid #dddddd;

    background-color: #fcf8fb;

    margin: 30px 0;

    padding: 20px 40px 40px;

}

#footMenu{

   display: none;

}

/* --- tablet用　ボックス --- */

div.section {
   width: 99%; /* ボックスの幅 */
   height: 250px; /* ボックスの高さ */
   background-color: #ffffff; /* ボックスの背景色 */
   border: 1px #c0c0c0 solid; /* ボックスの境界線 */
   margin-bottom: 20px;
   margin-top: 10px;
}

div.topics {
   width: 96%; /* ボックスの幅 */
   background-color: #ffffff; /* ボックスの背景色 */
   border: 1px #c0c0c0 solid; /* ボックスの境界線 */
   margin-bottom: 20px;
   margin-top: 10px;
   padding: 10px;
}


/* --- tablet用　見出し --- */

div.section h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -0.9em 0 0 3px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}

div.topics h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -2.0em 0 0 1px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}


/* --- tablet用　ボックス内の段落 --- */

div.section p {

margin: 1em 10px; /* 段落のマージン（上下、左右） */

}



}



@media screen and (max-width: 655px) {

/* ======== スマートフォン用のスタイル記述  ======== */

img, object, embed {

   max-width: 100%;

   height: auto;

}

img {

   -ms-interpolation-mode: bicubic;

}

#nav {

   display:none;

}

#nav_phone {

   display:block;

}

#wrapper {

   display: block;

   width:100%;

   font-size:18px;

   line-height: 180%;

   min-width:320px;

}

/* カフェ便り */
span#backnumber_button {
    position: fixed;
    bottom: 10px;
    right: 10px;
     
    border:1px solid #888888;
    padding:2pt;
    background-color: #ffb6c1;
    filter:alpha(opacity=85);
    -moz-opacity:0.85;
    -khtml-opacity: 0.85;
    opacity:0.85;
        
    text-shadow: 0 -1px 1px #FFF, -1px 0 1px #FFF, 1px 0 1px #aaa; 
    -webkit-box-shadow: 1px 1px 2px #E7E7E7;
    -moz-box-shadow: 1px 1px 2px #E7E7E7; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px;
}

.menubox01 {

   float:right;

   margin-right: 10px;

   margin-top: -10px;

}

#icatch {

   margin-top:60px;

   background:#fff;

}

#menu_pc{

   display: none;

}

#menu_phone {

   background-color: #0969A8;

   border-bottom: 1px solid #349ED1;

   display: none;

   width: 100%;

}

#menu_phone.open_menu {

   display:block;

}

#menu_phone ul {

   width:100%;

   overflow:hidden;

}

#menu_phone ul li {

   width:50%;

   height:50px;

   float:left;

   text-align:center;

}

#menu_phone ul li a {

   height:50px;

   line-height:50px;

   color:#fff;

   float:left;

}

#menu_phone ul li.nav01 a, #menu_phone ul li.nav01c a {

   width:100%;

   border-right: 1px solid #349ED1;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav02 a, #menu_phone ul li.nav02c a {

   width:100%;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav03 a, #menu_phone ul li.nav03c a {

   width:100%;

   border-right: 1px solid #349ED1;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav04 a, #menu_phone ul li.nav04c a {

   width:100%;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav05 a, #menu_phone ul li.nav05c a {

   width:100%;

   border-right: 1px solid #349ED1;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav06 a, #menu_phone ul li.nav06c a {

   width:100%;

   border-bottom: 1px solid #349ED1;

}

#menu_phone ul li.nav07 a, #menu_phone ul li.nav07c a {

   width:100%;

   border-right: 1px solid #349ED1;

}

#menu_phone ul li.nav08 a, #menu_phone ul li.nav08c a {

   width:100%;

   border-right: 1px solid #349ED1;

}

#menu_phone ul li.nav01c a, #menu_phone ul li.nav02c a, #menu_phone ul li.nav03c a, #menu_phone ul li.nav04c a, #menu_phone ul li.nav05c a, #menu_phone ul li.nav06c a, #menu_phone ul li.nav07c a, #menu_phone ul li.nav08c a {

   background-color:#0186C5;

}

#header {

   background: none;

   width:100%;

   height:130px;

}

#header_inner {

   width: 96%;

   height: 130px;

   margin: 0px 2% 0px;

   position: relative;

}

#header h1 {

   width: 200px;

   height: 18px;

   font-size: 75%;

   color: #FFFFFF;

   left: 0;

   line-height: 18px;

   position: relative;

}

#gnavi {

   visibility: hidden;

}



.logo {

   width: 238px;

   height: 33px;

   position: absolute;

   bottom:18px;

   left:0px;

}

.pc {

   display: none;

}

.phone {

   display: block;

}

.header_nav {

   width: 100px;

   height: 40px;

   position: absolute;

   top: 15px;

   right: 10px;

}

.header_nav li {

   float: left;

}

.header_nav li a {

   background: none;

   padding-left:0px;

   font-size:100%;

   line-height: 40px;

}

.header_nav .header_nav01, .header_nav .header_nav02 {

   display:none;

}

.header_nav .header_nav01 {

   display:block;

   float:left;

   margin-right: 10px;

}

.header_nav li.header_nav01 a {

   width: 100px;

   height: 40px;

}

.header_search {

   display:none;

}

.header_info {

   width: 223px;

   height: 36px;

   position: absolute;

   right: 0px;

   bottom: 15px;

}

.header_tel {

   width:223px;

   height:36px;

   margin-right:0px;

}

.header_info li {

   float: left;

}

.header_infobtn {

   display:none;

}

#main {

   width: 100%;

   background:none;

}

#main_bg {

   display:none;

}

.phone_main {

   width: 100%;

   height: 100%;

   display:block;

}

#contents {

   width: 96%;

   margin-left: 2%;

   padding-top: 1em;

   overflow:hidden;

}

#content_left {

   width: 100%;

   float:none;

}

.service_box {

   width: 100%;

   margin-bottom:35px;

}

.service_box .head {

   background: none;

   width: 93%;

   height: 60px;

   padding: 10px 2% 0 5%;

}

.service_box .head h1 {

   background:none;

   width: 177px;

   height: 35px;

   padding:0px;

   float: left;

   display:block;

}

.service_box .head span {

   width: 97px;

   height: 35px;

   float: right;

}

.service_box .head span a {

   background:none;

   width: 97px;

   height: 35px;

   padding:0px;

   display:block;

}

.service_box .inner {

   display:none;

}

.service_box .inner_phone {

   width: 100%;

   display:block;

   padding:5px 0px 0px 0px;

}

.service_list {

   width: 100%;

   border-bottom: 1px dotted #999999;

   float:left;

   padding-bottom:15px;

   margin-bottom:15px;

}

.service_list a.service_left {

   width: 35%;

   float:left;

   margin-right: 20px;

}

.service_list dl {

   width: 58%;

   float: left;

}

.service_list dl dt {

   margin-bottom:5px;

}

.service_list dl a {

   background: none;

   color: #0080CC;

   font-weight: bold;

   padding-left: 18px;

}

.works_box {

   width: 100%;

   margin-bottom:25px;

}

.works_box .head {

   background: none;

   width: 93%;

   height: 60px;

   padding: 10px 2% 0 5%;

}

.works_box .head h1 {

   background:none;

   width: 128px;

   height: 35px;

   padding:0px;

   float: left;

   display:block;

}

.works_box .head span {

   width: 97px;

   height: 35px;

   float: right;

}

.works_box .head span a {

   background:none;

   width: 97px;

   height: 35px;

   padding:0px;

   display:block;

}

.works_box .inner {

   width: 100%;

   padding:5px 0px 15px 0px;

   border:none;

}

.works_left {

   width: 100%;

   float: left;

   overflow:hidden;

   text-align:center;

   margin-bottom:15px;

}

.works_right {

   width: 100%;

   float: left;

}

.works_right li {

   width: 100%;

   margin-bottom:5px;

}

.works_right li a {

   background: none;

arr_s  padding-left:18px;

   color:#0080cc;

   font-weight:bold;

}

.news_box {

   width: 100%;

   margin-bottom: 50px;

}

.news_box .head {

   background: none;

   width: 93%;

   height: 60px;

   padding: 10px 2% 0 5%;

}

.news_box .head h1 {

   background:none;

   width: 128px;

   height: 35px;

   padding:0px;

   float: left;

   display:block;

}

.news_box .head span {

   width: 112px;

   height: 18px;

   margin-top: 10px;

   float: right;

}

.news_box .head span a {

   background:none;

   width: 109px;

   height: 15px;

   padding:0px;

   display:block;

}

.news_box .head span a img {

   float:left;

}

.news_box .inner {

   background:#FAFAFA;

   width: 95%;

   padding: 5px 15px 15px 15px;

   border:none;

}

.news_box .inner dl {

   width: 100%;

   float: left;

   border-bottom: 1px dotted #999999;

   margin-bottom:10px;

}

.news_box .inner dt {

   width: 86%;

   float: left;

   line-height: 20px;

   margin: 15px 0px 15px 0px;

   padding-left: 80px;

   color: #666666;

}

.news_box .inner dd {

   width: 100%;

   float: left;

   padding-bottom:15px;

}

.tag_news {

   background: none;

}

.tag_activity {

   background: none;

}

#content_right {

   float: none;

   width: 100%;

}

#aside {

   width: 100%;

   margin-bottom: 15px;

}

#aside h1 {

   background: none;

   width: 100%;

   height: 50px;

   overflow: block;

   padding: 0px;

   margin-bottom: 2px;

}

.aside_inner {

   background: #F3F3F3;

   width: 94%;

   padding: 20px 3% 15px;

   margin-bottom: 2px;

}

.aside_inner ul {

   width: 100%;

}

.aside_inner ul li {

   width: 100%;

   margin-bottom: 2px;

}

.aside_inner ul li a {

   background: none;

   width: 95%;

   height: 50px;

   display: block;

   line-height: 50px;

   padding-left: 5%;

}

.side_ttl01 {

   background:none;

   width: 100%;

   height: 25px;

   display:block;

   margin-bottom:15px;

   padding:0px;

}

.side_ttl02 {

   background:none;

   width: 100%;

   height: 25px;

   display:block;

   margin-bottom:15px;

   padding:0px;

}

.side_ttl03 {

   background:none;

   width: 100%;

   height: 25px;

   display:block;

   margin-bottom:15px;

   padding:0px;

}

.banner_box {

   display:none;

}

#footer {

   background: none;

   width: 100%;

   height: 30px;

}

#footer_inner {

   width: 96%;

   height: 30px;

   margin: 0 2%;

   position: relative;

}

.footer_logo {

   display:none;

}

.footer_nav {

   display:none;

}

.footer_navbottom {

   display:none;

}

#footer_inner small {

   width: 289px;

   height: 12px;

   position: absolute;

   top: 12px;

   right: 0px;

   line-height:100%

}

#footMenu{

   display: none;

}

.arr {

   background: none;

   padding-left:18px;

}

.line01 p{

   line-height: 36px;

   background: url("../images/bg-note_pc.png") bottom;

   height: 50%;

   margin: 0;

   padding: 0;

}

.bg_red {

    border: 1px solid #dddddd;

    background-color: #fcf8fb;

    margin: 30px 0;

    padding: 20px 40px 40px;

}



.shadow {

    display: inline-block; 

    box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8); /*横方向　下方向　ぼかし　広がり　色 */

}

/* --- スマホ用　ボックス --- */

div.section {
   width: 99%; /* ボックスの幅 */
   height: 250px; /* ボックスの高さ */
   background-color: #ffffff; /* ボックスの背景色 */
   border: 1px #c0c0c0 solid; /* ボックスの境界線 */
   margin-bottom: 20px;
}

div.topics {
   width: 93%;
   background-color: #ffffff; /* ボックスの背景色 */
   border: 1px #c0c0c0 solid; /* ボックスの境界線 */
   line-height: 1.7em;
   margin-bottom: 20px;
}


/* --- スマホ用　見出し --- */

div.section h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -0.9em 0 0 3px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}

div.topics h3 {
   position: relative; /* IE6用 */
   width: 100px; /* 見出しの幅 */
   margin: -2.0em 0 0 1px; /* 見出しのマージン（上右下左） */
   padding: 3px; /* 見出しのパディング */
   background-color: #ffc0cb; /* 見出しの背景色 */
   border: 1px #c0c0c0 solid; /* 見出しの境界線 */
   text-align: center;
}



/* --- スマホ用　ボックス内の段落 --- */

div.section p {

margin: 1em 10px; /* 段落のマージン（上下、左右） */

}



}


