@charset "utf-8";
/* トップ用 */


/*---- コンテンツ背景用 --------*/
.wrapper{
    width: 100%;
    padding: 0 auto;
    background-image: url(../img/grt-bg.jpg);
    background-repeat: no-repeat;
    background-size:cover;
 }


/*---- トピックス --------*/
#topics{
    display: inline-block;
    margin: 20px 30px;
    width: 500px;
    height:auto;
    padding: 20px;
    text-align: left;
    vertical-align: top;
    background-color: #fffcf9;
    border-radius: 10px;
}

/*-- NEWS&TOPICS埋め込み部分 --*/
ul#newsList{
	margin:0 0 15px;
	padding:0;
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
ul#newsList li{
	color:#666;
	font-size:12px;
	margin:0;
	padding:5px 0;
	margin-bottom:3px;
	border-bottom:1px dotted #59b517;
	line-height:120%;
	list-style-type:none;
}
a{
    color:#59b517;
    text-decoration:underline;
}
a:hover{
    color:#666;
    text-decoration:none;
}

.catName{
	display:inline-block;
	padding:3px 8px;
	border:1px solid #ccc;
	border-radius:6px;
	font-size:11px;
	line-height:100%;
	margin:0 2px;
}
.newMark{
	display:inline-block;
	border:1px solid #F00;
	padding:1px 4px;
	font-size:11px;
	line-height:100%;
	background:#ff6600;
	color:#fff;
	border-radius:5px;
}
.comment{
	display:block;
	padding:3px 0;
	float:left;
	overflow:hidden;
	width:250px;/* 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
}
.thumbNailWrap{
	display:block;
	width:110px;
	float:left;
	height:80px;
	overflow:hidden;
}
/*-- NEWS&TOPICS埋め込み部分ここまで --*/

#topics h1{
    display: inline;
}

.golist{
    display: inline;
    text-align: right;
    margin-right: 10%;
    margin-left:20%;
}

.golist a{
    text-decoration: none;
    color:#59b517;
    font-weight: bold;
}

.none_pc{
    display: none;
}

/*---- スタッフ募集 --------*/
#top-recruit{
    display: inline-block;
    width: 400px;
    padding-bottom: 20px;
    height:auto; 
    margin: 40px auto;
    text-align: center;
    border-radius: 15px;
    background-color: #e99e3f;
}

#top-recruit a{
    text-decoration: none;
    color:#fff;
}

.top-rec-img{
    width: 99%;/*ボーダー分調整*/
    height: 180px;
    padding-top: 30px;
    margin-bottom: 15px;
    background-image:url(../img/recruit01.jpg);
    background-repeat:no-repeat; 
    background-size: cover;
    border-radius: 15px;
    border: 2px solid #e99e3f;
    font-weight: bold;
}




/*---- greeting --------*/
#greeting{
    display: block;
   	margin:50px auto;
	width:700px;
	text-align:center;    
    vertical-align: top;
    }

    .grt-msg{
        padding: 50px 0;
    }

    .grt-msg p{
        font-size:11pt;
        line-height: 1.5;
        letter-spacing: 5px;
    }


    .grt-img{
        width:auto;
        height: auto;
        padding-bottom: 40px;
    }

    .grt-contents{
        text-align: center;
    }

    .grt-contents li{
        display: inline-block;
        width: 300px;
        border-radius: 15px;
        overflow: hidden;
    }

    .grt-contents img{
        width: 100%;
    }


/*---- 商品 --------*/
.jiman{
    padding-top: 40px;
    width: auto;
}
    .jiman img{width: 450px}

#top-item{
    display: block;
    margin: 0 auto;
    width: 100%;
    padding-top:40px;
    text-align: center;
}

#top-item figure{
    display: inline-block;
    width: 200px;
    height: auto;
    padding: 20px;
}

#top-item img{
    width: 100%;
    margin-bottom: 15px;
}

#top-item figure a{
    line-height: 1.2;
    text-decoration: none;
    color:#313131;
}
    
.cap{
    border-left: 3px dotted #ffa500;
}

.gotoitem{
    width: 200px;
    margin: 30px auto;
    padding: 10px;
}

.gotoitem p{
    border: 2px splid #e99e3f;
    border-radius: 10px;
}

.gotoitem a{
    text-decoration: none;
    color:#fff;
}

/*---- マップ --------*/
#map{
    margin: 40px auto;
    display: block;
    width: 600px;
    height:450px;
}

#map iframe{
    width: 100%;
    height: 100%;
}




/*------ 以下レスポンシブデザイン用　----------*/
/* 表示領域が480px以下 */

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

.none{
        display: none;
    }    
/*---- トピックス@480 --------*/
#topics{
    display: block;
    margin: 10% 0;
    width: 100%;
    height:auto;
    padding: 0 5px;
    text-align: left;
    border-radius:none;
}
.comment{
	display:inline-block;
	padding:3px 0;
	float:none;
	overflow:hidden;
	width:60%;/* 本文部分の幅。設置ページ合わせて変更 */
    vertical-align: top;
}

.up_ymd{
    display: block;
}
.thumbNailWrap{
	display:inline-block;
	width:28%;
	float:none;
	height:auto;
    margin: 2% 5% 0 0;
	overflow:hidden;
}

#topics h1{
    float: none;
}
.golist{
    text-align: right;
    margin-right: 5px;
}
.none_pc{
    display: block;
    text-align: right;
    margin-right: 5%;
}

/*---- スタッフ募集@480 --------*/
#top-recruit{
    display: block;
    width: 85%;
    padding-bottom: 20px;
}

.top-rec-img{
    width: 99%;/*ボーダー分調整*/
    height: auto;
    padding-top: 30px;
    margin-bottom: 15px;
    background-image:url(../img/recruit01.jpg);
    background-repeat:no-repeat; 
    background-size: cover;
    border-radius: 15px;
    border: 2px solid #e99e3f;
    font-weight: bold;
}


/*---- greeting@480 --------*/
#greeting{
    display: block;
   	margin:20px auto;
	width:100%;
    }

    .grt-msg{
        padding: 20px;
    }
    .grt-msg img{
        border-bottom:solid 1px #333;
    }

    .grt-msg p{
        font-size:10pt;
        letter-spacing: 3px;
    }


    .grt-contents li{
        display: inline-block;
        width: 300px;
        border-radius: 15px;
        overflow: hidden;
    }


/*---- 商品@480 --------*/
.jiman{
    padding-top: 20px;
    margin:0 auto;
    width: 80%;
    border-bottom:solid 1px #333;
}
    .jiman img{
        width: 100%;
    }
    
#top-item{
    width: 100%;
    height:auto;
    margin: 0;
    padding-top:10%;
    vertical-align: top;
}

#top-item figure{
    display: inline-block;
    width:48%;
    padding: 0;
    height: auto;
}
    #top-item figure a{
        text-decoration: none;
        color:#313131;
    }
    
#top-item img{
    width: 100%;
    margin: 10px 0;
}
.cap{
    border-left: 3px dotted #ffa500;
    vertical-align: middle;
    line-height: 1.2;
    font-size: 85%;
}

.gotoitem{
    width: 200px;
    margin: 30px auto;
    padding: 10px;
}

.gotoitem p{
    border: 2px splid #e99e3f;
    border-radius: 10px;
}

.gotoitem a{
    text-decoration: none;
    color:#fff;
}

/*---- マップ@480 --------*/
#map{
    margin: 40px 0;
    display: block;
    width: 100%;
    height:300px;
    overflow: hidden;
}

#map iframe{
    width: 100%;
    height: 100%;
}



}