/*--------------------------------------------
@media screen and (max-width: 768px) {}
@media screen and (min-width: 769px) {}
---------------------------------------------*/


@media screen and (min-width: 769px) {
body{
scrollbar-3dlight-color:#ffffff;
scrollbar-arrow-color:#999999;
scrollbar-track-color:#ffffff;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#999999;
scrollbar-shadow-color:#999999;

background-image:url(../image/flower/piece4.jpg);
background-repeat:no-repeat;
background-position: right bottom  ;
background-attachment:fixed;
background-size:15% auto;
}}

.container{
margin:0 auto;
}
@media screen and (max-width: 768px) {
.container{
width:auto;
min-width:320px;
overflow: hidden;}}
@media screen and (min-width: 769px) {
.container{
background-color:#ffffff;
max-width:850px;}}


/*------ header-----------*/

@media screen and (max-width: 768px) {
#header{
width:100%;
height:60px;
background:url(../image/life-top-sp1.jpg) no-repeat;
background-size:100% auto;
}
#header a{
width:100%;
height:60px;
background:url(../image/life.gif) no-repeat;
background-position:center left;
display:block;
text-indent:-9999px;
background-size:55% auto;	/*fileサイズの半分で表示*/
}}
@media screen and (min-width: 769px) {
#header{
max-width:100%;
height:110px;
text-indent:-9999px;
background:url(../image/life-top1.jpg) no-repeat;
background-position:top center;
background-size:100% auto;
}
#header a{
max-width:100%;
height:110px;
display:block;}}

/*------ header end-----------*/

h1{
font-size:15px;
color:#660000;
font-weight:700;
line-height:5em;
text-align:center;
}

/*-clearfix用のbox-*/
@media screen and (max-width: 768px) {
.centerbox{
width:auto;}}
@media screen and (min-width: 769px) {
.centerbox{
width:99%;}}
/*-clearfix用のbox-*/

.contents{
font-size:14px;
text-align:left;
}
@media screen and (max-width: 768px) {
.contents{
width:auto;
margin-bottom:10px;}}
@media screen and (min-width: 769px) {
.contents{
max-width:80%;
float:left;
padding-bottom:100px;}}

@media screen and (min-width: 769px) {
.t-margin{
margin-top:15px;	/*コンテンツの高さ調整*/
}}

/*------- link --------------*/

@media screen and (max-width: 768px) {
.p1{
margin-left:10px;}}

@media screen and (max-width: 768px) {
.list3{
width:auto;
margin-left:10px;
margin-right:10px;
}}
@media screen and (min-width: 769px) {
.list3{
margin-left:10px;
margin-bottom:5px;
padding-right:20px;	/*コンテンツ内右余白*/
}}

.list3 dt {
color:#804040;
font-weight: bold;
padding-top:10px;
border-top:3px solid #dadada;
}
@media screen and (max-width: 768px) {
.list3 dt {
border-top:2px dotted #000000;
}}

.list3 dt a{
font-weight: bold;
}

.list3 dd {
line-height:1.4em;
padding-top:5px;
padding-bottom:5px;
}

.list3 dd a{
/*font-weight: bold;*/
}
.contents-c{ /* contents下のセンタリング用 */
font-size:13px;
font-weight: bold;
text-align: center;
padding-top:15px;
padding-bottom:15px;
border-top:3px solid #dadada;
}

.contents-cbox{	/*下のリンク用*/
max-width:360px;
min-width:320px;
_width:360opx;
margin:0 auto;
}
.contents-cbox li{
line-height:280%;
text-align: left;
}

.contents-r{ /* contents下の右寄せ用 */
font-size:13px;
text-align: right;
padding-top:10px;
padding-bottom:10px;
border-top:3px solid #dadada;
}
@media screen and (max-width: 768px) {
.contents-c{
width:93%;
margin:0 auto;
border-top:2px dotted #000000;}
.contents-r{
width:93%;
margin:0 auto;
border-top:2px dotted #000000;}}
@media screen and (min-width: 769px) {
.contents-c{
margin-left:10px;
margin-right:20px;}
.contents-r{
margin-left:10px;
margin-right:20px;}}


/*------- link end--------------*/

/*-------- sidebar -----------------*/

@media screen and (max-width: 768px) {
.side-all{
width:100%;
background-image:url(../image/piece/flower/photo_flower11-01-x.gif);
background-position:top right;
}}
@media screen and (min-width: 769px) {
.side-all{
float:right;
width:20%;
}}

@media screen and (max-width: 768px) {
#sidebar{
width:240px;
font-size:14px;
background-color:#ffffff;
line-height:1.4em;
margin:0 auto;
}}
@media screen and (min-width: 769px) {
#sidebar{
font-size:13px;}}

#sidebar h2{
color:#f7f7f7;
font-weight:600;
text-align:center;
margin:20px 0px 5px;/*pxをそれぞれ付けないとie9に効かない*/
background-color:#999999;
}
@media screen and (max-width: 768px) {
#sidebar h2{
width:240px;
margin: 0 auto;
font-size:14px;
line-height:2em;}}
@media screen and (min-width: 769px) {
#sidebar h2{
width:100%;
font-size:13px;
line-height:1.5em;}}

#sidebar li a{
text-align: left;
display : block;		/* 幅固定(固定しないと線が消える) */
border-bottom : 2px dotted #333333;
}
@media screen and (max-width: 768px) {
#sidebar li a{
width:auto;				/*--100％指定すると画面右に飛び出る*/
font-size:14px;
line-height:300%;
padding-left:40px;}}
@media screen and (min-width: 769px) {
#sidebar li a{
width:96%;
line-height:200%;
padding-left:10px;}}

#sidebar li a:hover{
color : #cccccc;
border-bottom : 2px solid #cccccc;
}
/*-------- sidebar end -----------------*/

/* 画像で線を引く */
@media screen and (max-width: 768px) {
.s-line1{		/* 上の線 */
width: 100%;
background: url(../image/line-gray4.gif) repeat-x;
padding-top:5px;}}

.u-line1{		/* 下の二重線 */
width:100%;
background: url(../image/line-gray2.gif) repeat-x;
height:9px;
}
@media screen and (min-width: 769px) {
.u-line1{
margin-left:10px;}}


/*---- other shop  ----*/
.other-shop1 ul{
}
.other-shop1 li{
font-size:13px;
line-height:180%;
padding-right:15px;
padding-left:15px;
display: inline;
white-space:nowrap;
}
