@CHARSET "UTF-8";


/*====================================
ファーストビュー の画像切り替え
====================================*/
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
}

@media only screen and (max-width: 767px) {
img { max-width: 100%; }
}





/*====================================
 グローバルナビゲーション
※①・②・③は同じ色に設定してください
====================================*/

#gNav {
	background-color: #FFFFFF; /*グローバルナビゲーション背景色①*/
}

#gNav nav a:link,
#gNav nav a:visited {
	color: #fff; /*	文字カラー(①に対して見やすい色を設定) */
}

#gNav nav a:active,
#gNav nav a:hover {
	background-color: #FFFFFF; /*②マウスオーバー時背景カラー*/
	color: #fff; /*文字カラー(②に対して見やすい色を設定)*/
}

/*小さい画面時のナビゲーションボタン*/
#leftPanelButton .toggle, #rightPanelButton .toggle {
	background-color: #FFFFFF; /*③モバイルUI時背景カラー*/
	color: #fff; /*矢印のカラー(③に対して見やすい色を設定)*/
}


/*====================================
ヘッダー
====================================*/
#header {
background-color:#ffd300;
width:100%;
}

#header nav{
background:#000000;
}

#header h1{
margin-bottom:20px;
}

#header .adbox{
padding-top:43px;
}
#header nav a{
background-color:#ffd300;
color:#000000;
}
#header nav a:hover{
background-color:#eee;
}

/*====================================
ナビゲーション
====================================*/

.my-parts ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.my-parts ul::after {
	content: "";
	display: block;
	clear: both;
}
.my-parts ul li {
	float: left;
	border-left: 1px solid rgba(0,0,0,.1);
}
.my-parts ul li:first-child {
	border-left: none;
}

.my-parts ul li a {
	display: block;
	padding: 0em 1.5em;
	text-decoration: none;
	color: #333;
	background: #fff;
	text-align: center;
        font-weight: bold;
}
.my-parts ul li a:hover {
	background: #eee;
}

/*====================================
ボディー
====================================*/

body{
	margin: 0;
}
/*====================================
 リンクカラー
====================================*/

a:link,a:visited {
  color: #767069; /* リンク色 */
}
a:hover,a:active {
  color: #908a82; /* マウスオーバー時リンク色 */
}

/*====================================
 main-contents (中央・メインカラム) 
====================================*/

/*見出し(H2)-----------------------------------*/

#main-contents h2 {
	color: #999999; /*文字色*/
	background-color: #faf9f3; /*背景色*/
}


/*====================================
 sub-contents,side-contents (サイドカラム) 
====================================*/

/*見出し(H2)-----------------------------------*/

#sub-contents h2, #side-contents h2 {
	color: #666666; /*文字色*/
	border-left-color : #9c968f; /*左ボーダー色*/
}

/*====================================
 footer-wrapper (フッターメニューエリア) 
※①・②は同じ色に設定してください
====================================*/

#footer-wrapper {
	background: #ffd300; /* ①背景色 */
	border-top-color :#ffd300; /* ①に対してのハイライト色(ライン) */
	color: #8d7966; /* 文字色(①に対して見やすい色を設定) */
       margin-bottom:-28px;
}

#footer-wrapper .container .row ul li {
	border-bottom-color: #f3efe0; /* メニュー区切り下線色 */
}

#footer-wrapper .container .row ul li a:link , #footer-wrapper .container .row ul li a:visited {
color: #8d7966 !important; /* リンク色(①に対して見やすい色を設定) */
}

#footer-wrapper .container .row ul li a:hover ,  #footer-wrapper .container .row ul li a:active{
  background-color: #f3efe0; /* メニュー マウスオーバー時背景色 */
}

#footer-wrapper a:link , #footer-wrapper a:visited {
	color: #8d7966 !important; /* リンク色(①に対して見やすい色を設定) */
}

#footer-wrapper a:active , #footer-wrapper a:hover {
	color: #908a82; /* マウスオーバー時リンク色 */
}

#footer-wrapper h2 {
	color: #333; /* フッタ内見出し */
}

.row+.row>*{
 display:none;
}

/* BackToTop */
#footer-wrapper .backtotop a {
	background-color: #ffd300 !important; /* ②「TOPへもどる」背景色 */
	border-top-color: #e5dbbc !important; /* 「TOPへもどる」上部はハイライトカラー(②に対して少し明るい色推奨) */
}

#skel-panels-pageWrapper{
   width: 100%;
     position: relative;
     height:auto !important; /*IE6対策*/
     height: 100%; /*IE6対策*/
     min-height: 100%;
}


#footer{
  background-color: #57FF23;
  width:100%;
  height: 100px;
  position: absolute;
  bottom: 0;
}

.adbox p{
text-align: center;!important
}

#footer-wrapper a:link, #footer-wrapper a:visited{
color:#000000 !important;
}

#footer-wrapper{
color:#000000;
}

/*====================================
 body#shop_body (ミニページ編集画面) 
====================================*/
#shop_body .baseinfo h3 {
  	border-left-color: #a8a39d;
}
.toolbox .shop_list_box p a, #shop .shop_list_box p a, .toolbox .shop_list_box ul a, #shop .shop_list_box ul a{
margin-right:0em;
}

/*====================================
 ボタンカラー (2014.12 added)
====================================*/

.toolbox h5.bottom a:link , .toolbox h5.bottom a:visited {
  background-color: #000000; /* ボタンデフォルト背景色 */
  color: white; /* 文字色：ボタン背景色に対して見やすい色を設定してください */
}

.toolbox h5.bottom a:hover , .toolbox h5.bottom a:active {
  background-color: #4d4d4d; /* ボタンマウスオーバー時背景色 */
  color: white; /* 文字色：ボタンマウスオーバー時背景色に対して見やすい色を設定してください */
}

#sub-contents h2, #side-contents h2{
border-left-color:#ffd300;
}

/*====================================
 タグカラー (2014.12 added)
====================================*/
.t_tag li a {
  background-color: #b2d33c;  /* タグ背景色 */
  color: #ffffff; /* タグ文字色:タグ背景色に対して見やすい色を設定してください */
}

.t_tag li a:hover {
background-color: #faf9f3; /* マウスオーバー時タグ背景色 */
color: #cccccc;　 /* マウスオーバー時タグ文字色:タグ背景色に対して見やすい色を設定してください */
}

/*====================================
 フォームボタンカラー (2014.12 added)
====================================*/
input[type="button"],
input[type="submit"] {
color: white;
  background: #000000;  /* フォームボタン背景色 */
color:#fff;　 /* フォームボタン文字色：フォームボタン背景色に対して見やすい色を設定してください */
}

/*====================================
 カレンダーカラー(2014年12月追記)
====================================*/
.event dl {
border-color:#e74c3c; /* (A)-- AとBは同じカラーに設定してください */
}

.event dl dd.month {
background-color:#e74c3c; /* (B)-- AとBは同じカラーに設定してください */
color:#fff; /* Bに対して見やすい色を設定してください */
}

/*====================================
ミニメニューカスタム
====================================*/
#main .container{
padding-bottom:40px;
}

.shop_list_box_wrapper .shop_list_box{
overflow:hidden !important;
}

.shop-form-text,.category{
display:none;
}

.toolbox .shop_list_box, #shop .shop_list_box{
width:48% ;
margin:0 8px 16px 8px;
}
.toolbox .shop_list_box.premium h3{
background-color: #efead7 !important;
border-bottom: 1px #d8d6d3 solid !important;
}
.shop_list_box.premium{
background-color: #ffffff;
border: 1px #d8d6d3 solid;
}
#main-contents h2{
background-color:#ffd300;
color:#000000;
font-weight: bold;
}

.toolbox h5.bottom{
 width: 100%;
  margin: 0 auto;
text-align:center;
margin-top:10px;
}
.toolbox h5.bottom a{
padding: 9px 35px;
}

.toolbox .shop_list_box h3, #shop .shop_list_box h3{
background-color:#efead7;
}
.main-row{
padding-top:50px;
}
#navi{
 display:none;
}


/*中山編集*/
#share .icon img{
	width:50px;
}

#shop #image_g li{
	width:auto;
	height:auto;
}

/*====================================
サイドバー
====================================*/

.toolbox .box{
margin-bottom:5px;
}

input[type="text"], input[type="password"]{
margin:9px;
}

.toolbox .box{
padding: 22px 0 5px 0;
}
#sub-contents h3, #side-contents h3{
font-size:15px;
}
#sub-contents h2, #side-contents h2{
color:#000000;
font-size:15px;
}

a:link, a:visited{
color:#000000;
}

#side-contents .box.dir > p a.next_dir + a, #sub-contents .box.dir > p a.next_dir + a, #main-contents .box.dir > p a.next_dir + a{
text-decoration:none;;
}

#side-contents .box.dir > p a.next_dir + a:hover {
color:#c3b47b; 
}


/*====================================
min-width:319px
====================================*/

@media (min-width:319px){
.toolbox .shop_list_box, #shop .shop_list_box{
width:100%;
margin:0 0px 10px 0px;
}
ul#navi{
margin:0px;
}
#leftPanelButton{
 display:none;
}
#titleBar img{
height:30px;
margin-top:7px;
float:left;
margin-left:11px;
}
#titleBar {
  box-shadow: 2px 2px 4px #4c4846;
}
}


/*====================================
min-width:320px
====================================*/


@media (min-width:320px){
.toolbox .shop_list_box, #shop .shop_list_box{
width:100%;
margin:0 0px 10px 0px;
}
ul#navi{
margin:0px;
}
#leftPanelButton{
 display:none;
}
#titleBar img{
height:43px!important;
margin-top:11px;
float:left;
margin-left:14px;
}
#titleBar {
  box-shadow: 2px 2px 4px #4c4846;
}
#titleBar{
background-color: #ffd300;
height:64px!important;
}
#leftPanelButton .toggle, #rightPanelButton .toggle{
background-color:#000000 !important;
}
#rightPanelButton{
width:65px!important;
height:65px!important;
background-color: #000;
}
#leftPanelButton, #rightPanelButton {
    box-shadow: unset;
}
#rightPanelButton .toggle{
padding-right:26px;
}
#leftPanelButton .toggle, #rightPanelButton .toggle{
height:65px;
width:65px;
line-height:65px;
}
.main-row{
padding-top:0px;
}
#main .main-row{
margin:0px;
}
}


/*====================================
min-width:782px
====================================*/

@media (min-width:782px){
#titleBar {
    height: 60px!important;
}
#leftPanelButton .toggle, #rightPanelButton .toggle {
    height: 61px !important;
    width: 65px !important;
}
#titleBar img {
    height: 45px!important;
}
#header .adbox {
    float: left;
    padding-right: 0px;
    padding-top: 15px;
    padding-bottom: 25px;
}
#header h1 {
    width: 100%;
}
}


/*====================================
min-width:767px
====================================*/

@media (min-width:767px){
.toolbox .shop_list_box, #shop .shop_list_box{
width:100%;
margin:0 0px 15px 0px;
}
.toolbox{
margin-bottom:0px;
}
.toolbox .box{
padding:0px;
}
.search_tb search_toolbox_0 toolbox{
padding: 0px 0px 10px 0px;
}
.row>*{
padding-left:0px;
}
section.middle-content{
width:100%;
}
.container{
width:85%;
}
section, article{
padding:0 0 20px 30px;
}
#logo img{

}
}
/*====================================
min-width:850px
====================================*/

@media (min-width:850px){
#header .adbox {
    float: right;
    padding-right: 0px;
    padding-top: 50px;
    padding-bottom: 0px;
}
#header h1 {
    width: auto;
}
}

/*====================================
min-width:1023px
====================================*/

@media (min-width:1023px){
.toolbox .shop_list_box, #shop .shop_list_box{
width:47%;
margin:0 16px 16px 0px;
}

.row>*{
padding-left:0px;
}
#main-contents h2{
width:96%;
}
#header h1{
margin-left:15px;
}
.toolbox p{
font-size:12px!important;
}
#side-contents .box.dir > p a, #sub-contents .box.dir > p a, #main-contents .box.dir > p a{
padding:0px;
}
#main{
padding:4% 0 0 0;
}
#header .adbox{
padding-top:50px;
padding-right:0px;
}
}