/*index
------------------------------------------------------------*/
/* topページメニューエリア */
#main_menu {
	display: block;
	width: 310px;
	height: 195px;
	margin: 0 auto 10px;
	padding-top: 24px;
	padding-left: 24px;
	line-height: 40px;
	background: url(../../public/sp_images/bg_main_menu.png) left top no-repeat;
	-webkit-background-size: contain;
	        background-size: contain;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
#main_menu img {
	width: 210px;
	margin-bottom: 8px;
}
a.menu_btn_about {
	background: url(../sp_images/menu_btn_about2way.png) center top no-repeat;
}
a.menu_btn_about:hover, a.menu_btn_about:active {
	background: url(../sp_images/menu_btn_about2way.png) center bottom no-repeat;
}
a.menu_btn_point {
	background: url(../sp_images/menu_btn_point2way.png) center top no-repeat;
}
a.menu_btn_point:hover, a.menu_btn_point:active {
	background: url(../sp_images/menu_btn_point2way.png) center bottom no-repeat;
}
a.menu_btn_character {
	background: url(../sp_images/menu_btn_character2way.png) center top no-repeat;
}
a.menu_btn_character:hover, a.menu_btn_character:active {
	background: url(../sp_images/menu_btn_character2way.png) center bottom no-repeat;
}
a.menu_btn_news {
	background: url(../sp_images/menu_btn_news2way.png) center top no-repeat;
}
a.menu_btn_news:hover, a.menu_btn_news:active {
	background: url(../sp_images/menu_btn_news2way.png) center bottom no-repeat;
}
a.menu_btn_wallpaper {
	background: url(../sp_images/menu_btn_wallpaper2way.png) center top no-repeat;
}
a.menu_btn_wallpaper:hover, a.menu_btn_wallpaper:active {
	background: url(../sp_images/menu_btn_wallpaper2way.png) center bottom no-repeat;
}
a.menu_btn_about, a.menu_btn_about:hover, a.menu_btn_about:active,
a.menu_btn_point, a.menu_btn_point:hover, a.menu_btn_point:active,
a.menu_btn_character, a.menu_btn_character:hover, a.menu_btn_character:active,
a.menu_btn_news, a.menu_btn_news:hover, a.menu_btn_news:active,
a.menu_btn_wallpaper, a.menu_btn_wallpaper:hover, a.menu_btn_wallpaper:active {
	display: block;
	width: 210px;
	height: 22px;
	margin-bottom: 8px;
	padding: 0 2px;
  -webkit-background-size: 210px auto;
	        background-size: 210px auto;
}

/* topページ下部丸ボタン */
a.fb_btn {
	background: url(../sp_images/fb_btn2way.png) center top no-repeat;
}
a.fb_btn:hover, a.fb_btn:active {
	background: url(../sp_images/fb_btn2way.png) center bottom no-repeat;
}
a.twitter_btn {
	background: url(../sp_images/twitter_btn2way.png) center top no-repeat;
}
a.twitter_btn:hover, a.twitter_btn:active {
	background: url(../sp_images/twitter_btn2way.png) center bottom no-repeat;
}

a.chocoshop_btn {
	background: url(../sp_images/btn_top_chocoshopicon.png) center top no-repeat;
}
a.chocoshop_btn:hover, a.chocoshop_btn:active {
	background: url(../sp_images/btn_top_chocoshopicon.png) center bottom no-repeat;
}
a.fb_btn, a.fb_btn:hover, a.fb_btn:active,
a.twitter_btn, a.twitter_btn:hover, a.twitter_btn:active{
	display: block;
	width: 42px;
	height: 42px;
	padding: 0 2px;
	-webkit-background-size: 42px auto;
	        background-size: 42px auto;
}

a.chocoshop_btn,a.chocoshop_btn:hover, a.chocoshop_btn:active{
	display: block;
	width: 100px;
	height: 88px;
	margin-bottom: 5px;
	-webkit-background-size: 100px auto;
	        background-size: 100px auto;
}

/* ゲソ天エリア */
.gstn_area, .gstn_area_jizen, .gstn_area_release {
  display: block;
  position: relative;
  width: 320px;
  height: 275px;
  background: url(../sp_images/gstn_bg.png) left top no-repeat;
  background-size: cover;
}
.gstn_area .gstn_board, .gstn_area_jizen .gstn_board, .gstn_area_release .gstn_board {
  padding: 78px 30px 0 30px;
  list-style: none;
  list-style-type: none;
  font-size: x-small;
  text-align: left;
}
.gstn_area .bold, .gstn_area_jizen .bold, .gstn_area_release .bold {
  font-weight: bold;
  font-size: 10.5px;
}
.gstn_area .gstn_main, .gstn_area_jizen .gstn_main, .gstn_area_release .gstn_main {
  padding-left: 5px;
  line-height: 1.2;
}
.gstn_area_jizen {
  height: 355px;
  background: url(../sp_images/gstn_bg_02.png) left top no-repeat;
  background-size: cover;
}
.gstn_area_release {
  height: 355px;
  background: url(../sp_images/gstn_bg_03.png) left top no-repeat;
  background-size: cover;
}

/*banner
------------------------------------------------------------*/
a.banner_btn {
	background: url(../sp_images/banner_line2way.png) center top no-repeat;
}
a.banner_btn:hover, a.banner_btn:active {
	background: url(../sp_images/banner_line2way.png) center bottom no-repeat;
}

a.banner_btn,a.banner_btn:hover, a.banner_btn:active{
	display: block;
	width: 200px;
	height: 47px;
	margin-top: 20px;
	-webkit-background-size: 200px auto;
	        background-size: 200px auto;
}
.line_btn img{
	padding-top:3px;
}

/* topページフッター */
#footer.index {
	margin: -20px auto;
	text-align: center;
}
.index_btm_btn {
	padding: 0 5px;
}
.index_copyright {
	display: block;
	height: 49px;
	background: url(../../public/sp_images/footer_copyright.png) left top no-repeat;
	-webkit-background-size: 320px auto;
					background-size: 320px auto;
}
#circle_btn_area {
	margin: 10px auto 0px;
	width: 275px;
}
#outside_btn_area {
	margin: 10px auto 0px;
	width: 310px;
}
/*page
------------------------------------------------------------*/
/* ヘッダー背景 */
#header_area.about {
	background: url(../../public/sp_images/header_title_about.png) left top no-repeat;
}
#header_area.character {
	background: url(../../public/sp_images/header_title_character.png) left top no-repeat;
}
#header_area.news {
	background: url(../../public/sp_images/header_title_news.png) left top no-repeat;
}
#header_area.point {
	background: url(../../public/sp_images/header_title_point.png) left top no-repeat;
}
#header_area.wallpaper {
	background: url(../../public/sp_images/header_title_wallpaper.png) left top no-repeat;
}
#header_area.about, #header_area.character, #header_area.news,
#header_area.point, #header_area.wallpaper {
	-webkit-background-size: contain;
	        background-size: contain;
}

/*about
------------------------------------------------------------*/
/* YouTubeエリア */
.movie_top_deco {
	position: absolute;
	top: -20px;
	left: 9px;
	width: 300px;
	padding: 0;
}
.movie_area {
	display: block;
	position: relative;
	width: 300px;
	margin: 40px auto 20px;
	padding: 10px;
	background: url(../../public/sp_images/movie_bg.png) center top no-repeat;
	-webkit-background-size: contain;
	        background-size: contain;
	text-align: center;
}

/*point
------------------------------------------------------------*/
/* ポイント1マーク */
.paper_mark_point1 {
	background: url(../../public/sp_images/paper_mark_point1.png) center top no-repeat;
}
/* ポイント2マーク */
.paper_mark_point2 {
	background: url(../../public/sp_images/paper_mark_point2.png) center top no-repeat;
}
/* ポイント3マーク */
.paper_mark_point3 {
	background: url(../../public/sp_images/paper_mark_point3.png) center top no-repeat;
}
/* ポイントマーク */
.paper_mark_point1, .paper_mark_point2, .paper_mark_point3 {
	display: block;
	position: absolute;
	top: -1px;
	left: 8px;
	width: 46px;
	height: 45px;
	-webkit-background-size: contain;
	        background-size: contain;
}
/* ポイント1画像 */
.paper_img_point1 {
	background: url(../../public/sp_images/paper_img_point1.png) center top no-repeat;
}
/* ポイント2画像 */
.paper_img_point2 {
	background: url(../../public/sp_images/paper_img_point2.png) center top no-repeat;
}
/* ポイント3画像 */
.paper_img_point3 {
	background: url(../../public/sp_images/paper_img_point3.png) center top no-repeat;
}
/* ポイント画像 */
.paper_img_point1, .paper_img_point2, .paper_img_point3 {
	display: block;
	width: 280px;
	height: 145px;
	margin: 0 auto 10px;
	padding: 0;
	-webkit-background-size: contain;
	        background-size: contain;
}
/* 「かわいい作物や動物を育てよう！」 */
.paper_title_point1 {
	background: url(../../public/sp_images/paper_title_point1.png) center top no-repeat;
}
/* 「お客さんからの依頼を解決しよう！」 */
.paper_title_point2 {
	background: url(../../public/sp_images/paper_title_point2.png) center top no-repeat;
}
/* 「日本全国の特産品をゲットしよう！」 */
.paper_title_point3 {
	background: url(../../public/sp_images/paper_title_point3.png) center top no-repeat;
}
/* ポイントのタイトル */
.paper_title_point1, .paper_title_point2, .paper_title_point3 {
	display: block;
	width: 280px;
	height: 25px;
	margin: 0 auto;
	padding: 0;
	-webkit-background-size: contain;
	        background-size: contain;
}

/*character
------------------------------------------------------------*/
#character_area {
	width: 300px;
	margin : 10px auto 0;
	padding: 0 20px;
	text-align: center;
}
#character_area ul {
	list-style: none;
	list-style-type: none;
	list-style-image: none;
	margin: 0 auto;
	padding: 0;
}
#character_area li {
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	display: -webkit-box;
	margin: 0 auto;
	-webkit-flex-flow: row nowrap;
	        flex-flow: row nowrap;
	-webkit-flex-direction: center;
	        flex-direction: center;
}
/* キャラクター画像　左上から順 */
.character_img01 {
	background: url(../../public/sp_images/character_img_01.png) center top no-repeat;
}
.character_img02 {
	background: url(../../public/sp_images/character_img_02.png) center top no-repeat;
}
.character_img03 {
	background: url(../../public/sp_images/character_img_03.png) center top no-repeat;
}
.character_img04 {
	background: url(../../public/sp_images/character_img_04.png) center top no-repeat;
}
.character_img05 {
	background: url(../../public/sp_images/character_img_05.png) center top no-repeat;
}
.character_img06 {
	background: url(../../public/sp_images/character_img_06.png) center top no-repeat;
}
.character_img07 {
	background: url(../../public/sp_images/character_img_07.png) center top no-repeat;
}
.character_img08 {
	background: url(../../public/sp_images/character_img_08.png) center top no-repeat;
}
.character_img09 {
	background: url(../../public/sp_images/character_img_09.png) center top no-repeat;
}
.character_img10 {
	background: url(../../public/sp_images/character_img_10.png) center top no-repeat;
}
.character_img11 {
	background: url(../../public/sp_images/character_img_11.png) center top no-repeat;
}
.character_img12 {
	background: url(../../public/sp_images/character_img_12.png) center top no-repeat;
}
.character_img01, .character_img02, .character_img03, .character_img04, .character_img05, .character_img06,
.character_img07, .character_img08, .character_img09, .character_img10, .character_img11, .character_img12 {
	display: block;
	width: 140px;
	height: 149px;
	-webkit-background-size: contain;
	        background-size: contain;
}

/*news
------------------------------------------------------------*/
/* 上アイコン */
.news_icon {
	display: block;
	width: 80px;
	height: 80px;
	background: url(../../public/sp_images/news_icon.png) center top no-repeat;
	-webkit-background-size: contain;
	        background-size: contain;
}
/* 上「ちょこっとファーム」 */
.account_area {
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	display: -webkit-box;
	width: 300px;
	margin: 0 auto;
	padding: 10px 20px 0;
	-webkit-flex-flow: row nowrap;
	        flex-flow: row nowrap;
	-webkit-flex-direction: center;
	        flex-direction: center;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	-webkit-box-pack: justify;
	-webkit-align-items: center;
	        align-items: center;
	-webkit-box-align: center;
					box-align: center;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.account_area a {
	display: block;
}
.news_name {
	display: block;
	width: 165px;
	height: 19px;
	background: url(../../public/sp_images/news_name.png) center top no-repeat;
	-webkit-background-size: contain;
	        background-size: contain;
}
.tl_area {
	display: block;
	width: 300px;
	margin-bottom: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #ffffff;
	border-radius: 5px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}


/*wallpaper
------------------------------------------------------------*/
/* 待ち受け画像横並べ */
#machiuke_area {
	width: 280px;
	margin: 0 auto;
}
/* 待ち受け1 */
.machiuke_1 {
	background: url(../../public/sp_images/machiuke1.png) center top no-repeat;
}
/* 待ち受け2 */
.machiuke_2 {
	background: url(../../public/sp_images/machiuke2.png) center top no-repeat;
}
/* 待ち受け */
.machiuke_1, .machiuke_2 {
	display: block;
	width: 135px;
	height: 240px;
	-webkit-background-size: 138px 245px;
	   -moz-background-size: 138px 245px;
	        background-size: 138px 245px;
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
	   -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
	        box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
/* 「ダウンロード」 */
.paper_title_dl {
	display: block;
	width: 280px;
	height: 29px;
	margin: 0 auto;
	padding-bottom: 5px;
	background: url(../../public/sp_images/paper_title_dl.png) center top no-repeat;
	-webkit-background-size: contain;
	        background-size: contain;
}
/* 「第2弾をお楽しみに！」 */
.paper_bottom_text {
	display: block;
	width: 212px;
	height: 25px;
	margin: 10px auto 0;
	padding: 0;
	background: url(../../public/sp_images/paper_bottom_text.png);
	-webkit-background-size: contain;
	        background-size: contain;
}