@charset "utf-8";
/* -----------------------------------------------
CSS file For Six Appart.
FileName: tpo-css.css
----------------------------------------------- */

/*================================================
BASE
================================================*/
div#TPcontainer{ font-size:100%;}

div#TPcontainer p,
div#TPcontainer ul,
div#TPcontainer li,
div#TPcontainer img,
div#TPcontainer h2,
div#TPcontainer h3,
div#TPcontainer h4,
div#TPcontainer dl,
div#TPcontainer dt,
div#TPcontainer dd{margin:0; padding:0; font-weight:normal; border:none; color:#333; line-height:1.6;}

/* Float Clear*/
div.clear{
	content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
	}


/*
TPmain（全ページ共通）
------------------------------------------------*/
div#TPmain{width:548px; float:right;}
div#topic_path p{font-size:12px!important; margin:0 0 20px 0!important;}

h3 {
  background-repeat: no-repeat;
}

/*ページタイトル*/
div#TPmain h2{width:548px; display:block; height:29px; overflow:hidden; text-indent:-10000em; background:none; background-color:none!important; margin:10px 0 20px 0;}
	h2.tokuchou	{background-image:url(/typepad/images/omakase/tokuchou_pttl.gif)!important; margin-bottom:0!important;}
	h2.dounyuu	{background-image:url(/typepad/images/omakase/dounyuu_pttl.gif)!important;}
	h2.kakaku	{background-image:url(/typepad/images/omakase/kakaku_pttl.gif)!important;}
	h2.sample	{background-image:url(/typepad/images/omakase/sample_pttl.gif)!important;}
	h2.qa	{background-image:url(/typepad/images/omakase/qa_pttl.gif)!important;}
	h2.inc	{background-image:url(/typepad/images/omakase/inc_pttl.gif)!important;}



/*
TPside（全ページ共通）
------------------------------------------------*/
div#TPside{width:177px; float:left;}

	/*ボタン関連--------------------*/
	ul.btn li			{}
	ul.btn li a			{width:177px; height:87px; display:block; text-indent:-10000em; overflow:hidden; background-repeat:no-repeat;}
	ul.btn li a:hover	{background-position:0 -87px;}

		 li.buy a	{background-image:url(/typepad/images/omakase/btn_buy.gif);} 

		li.contact a{background-image:url(/typepad/images/omakase/btn_contact.gif); margin:5px 0 0 0!important;}


	/*ナビゲーション関連--------------------*/
	ul.snavi			{background:transparent url(/typepad/images/omakase/line_dot.gif) repeat-x top left; padding:1px 0 0 0!important; margin:20px 0 0 0!important;}
	ul.snavi li a		{width:177px; height:33px; display:block; text-indent:-1000em; background-repeat:no-repeat; overflow:hidden;}
	ul.snavi li a:hover	{background-position:0 -33px;}

		li.top a		{background-image:url(/typepad/images/omakase/snavi_top.gif);}
		li.tokucyou a	{background-image:url(/typepad/images/omakase/snavi_tokuchou.gif);}
		li.dounyuu a	{background-image:url(/typepad/images/omakase/snavi_dounyuu.gif);}
		li.kakaku a		{background-image:url(/typepad/images/omakase/snavi_kakaku.gif);}
		li.sample a		{background-image:url(/typepad/images/omakase/snavi_sample.gif);}
		li.kouchiku a		{background-image:url(/typepad/images/omakase/snavi_kouchikujire.gif);}
		li.qa a			{background-image:url(/typepad/images/omakase/snavi_qa.gif);}
		li#current a	{background-position:0 -33px;}



/*================================================
omakase.html（トップページ）
================================================*/

/*
FLASH Area
------------------------------------------------*/
div#flash_area{margin:20px 0 0 10px ;}
div#flash_area img{margin:0 0 0 10px !important;}

div#TPcontainer{
	width:740px;
	padding:0;
	text-align:left;
	padding:20px 0 0 0;
	float:right;
	}


/*
TPmain（omakase.html メインエリア）
------------------------------------------------*/
h2.top_h2{
	background:transparent url(/typepad/images/omakase/top_h2.gif) no-repeat top left!important;
	height:24px;
	width:548px;
	display:block;
	text-indent:-10000em;
	font-size:0.1px;
	line-height:0;
	margin:0!important;
	}

ul.top_list01	{margin:0 0 20px 0;}
ul.top_list01 li{width:267px; height:58px; display:block; text-indent:-10000em; background-repeat:no-repeat; float:left; font-size:1px!important; line-height:0; color:#fff;}

	li.list01_1{background-image:url(/typepad/images/omakase/top_list1_01.gif); margin:0 14px 5px 0!important;}
	li.list01_2{background-image:url(/typepad/images/omakase/top_list1_02.gif); margin:0 0 5px 0!important;}
	li.list01_3{background-image:url(/typepad/images/omakase/top_list1_03.gif); clear:both; margin:0 14px 20px 0!important;}
	li.list01_4{background-image:url(/typepad/images/omakase/top_list1_04.gif); margin:0 0 20px 0!important;} 


h3.top_h3{
	background:transparent url(/typepad/images/omakase/top_h3.gif) no-repeat top left!important;
	height:123px;
	width:548px;
	clear:both;
	text-indent:-10000em;
	}

ul.tokuchou li			{float:left;}
ul.tokuchou li a		{width:131px; height:92px; display:block; text-indent:-10000em; margin:10px 8px 0 0; overflow:hidden;}
ul.tokuchou li a:hover	{background-position:0 -92px;}

	li.list02_1 a{background-image:url(/typepad/images/omakase/tokuchou_list_01.gif);}
	li.list02_2 a{background-image:url(/typepad/images/omakase/tokuchou_list_02.gif);}
	li.list02_3 a{background-image:url(/typepad/images/omakase/tokuchou_list_03.gif);}
	li.list02_4 a{background-image:url(/typepad/images/omakase/tokuchou_list_04.gif); margin:10px 0 0 0!important;}



/*================================================
tpo_feature.html（特徴/内容ページ）
================================================*/
div.tokuchou	{width:548px; margin:0 0 25px 0;}
div.tokuchou h4	{width:548px; height:57px; display:block; text-indent:-10000em; overflow:hidden; border:none!important; background-repeat:no-repeat; margin:0 0 5px 0!important; font-size:0.1px; line-height:0;}
div.tokuchou div.left{float:left; width:265px;}
div.tokuchou div.right{float:right; width:265px;}

	
	h3.tokuchou_h3{
		background:transparent url(/typepad/images/omakase/tokuchou_h3.gif) no-repeat top left!important;
		height:110px;
		width:548px;
		clear:both;
		text-indent:-10000em;
		margin:3px 0 0 0!important;
		}

	/* POINT 1-4 見出し*/
	h4.point01{background-image:url(/typepad/images/omakase/tokuchou_01_ttl.gif);}
	h4.point02{background-image:url(/typepad/images/omakase/tokuchou_02_ttl.gif);}
	h4.point03{background-image:url(/typepad/images/omakase/tokuchou_03_ttl.gif);}
	h4.point04{background-image:url(/typepad/images/omakase/tokuchou_04_ttl.gif);}

	p.tokuchou_txt{margin:15px 0 10px 0!important;}
	p.tokuchou_txt02{margin:10px 0 25px 0!important; background:#fff url(/typepad/images/omakase/line_dot.gif) repeat-x top left!important; padding:5px 0 0 0!important; display:block;}

	/* 特徴アイコン*/
	ul.tokuchou02 	{margin:5px 0!important; display:block; }
	ul.tokuchou02 li{width:81px; height:79px; display:block; overflow:hidden; background-repeat:no-repeat; text-indent:-10000em; float:left; margin:0 5px 0 0!important;}

		ul.tokuchou02 li.list03_1{background-image: url(/typepad/images/omakase/tokuchou_img01.gif);}
		ul.tokuchou02 li.list03_2{background-image: url(/typepad/images/omakase/tokuchou_img02.gif);}
		ul.tokuchou02 li.list03_3{background-image: url(/typepad/images/omakase/tokuchou_img03.gif);}


div#end{margin:0!important; padding:0!important;}

/*================================================
top-incase.html（導入事例ページ）
================================================*/

div#TPcontainer h3.develop {
  margin: 10px 0;
  font-size: 14px;
  font-weight: bold;
  border-bottom: solid 1px #ddd;
}

div#showcase div.section {
  float: left;
  margin-right: 11px;
  margin-bottom: 15px;
}

div#showcase div.section.last {
  margin-right: 0;
}

div#mainContents ul.incaseul {
  margin: 15px 0 15px 10px;
}

div#mainContents ul.incaseul li {
  line-height: 1.8;
}

/*================================================
top-flow.html（導入までの流れページ）
================================================*/
/* 導入フロー */
ul.dounyuu{margin-bottom:25px!important;}
ul.dounyuu li			{float:left;}
ul.dounyuu li a			{display:block; overflow:hidden; text-indent:-10000em;}
ul.dounyuu li a:hover	{background-position:0 -78px;}

	ul.dounyuu li.list_1 a			{background-image:url(/typepad/images/omakase/dounyuu_list_01.gif); width:141px; height:78px;}
	ul.dounyuu li.list_2 a			{background-image:url(/typepad/images/omakase/dounyuu_list_02.gif); width:141px; height:78px;}
	ul.dounyuu li.list_3 a			{background-image:url(/typepad/images/omakase/dounyuu_list_03.gif); width:141px; height:78px;}
	ul.dounyuu li.list_4 a			{background-image:url(/typepad/images/omakase/dounyuu_list_04.gif); width:124px; height:78px;}
	ul.dounyuu li.list_5			{margin-top:7px!important;}
	ul.dounyuu li.list_5 a			{background-image:url(/typepad/images/omakase/dounyuu_list_05.gif); width:547px; height:56px; clear:both; margin-bottom:15px!important;}
	ul.dounyuu li.list_5 a:hover	{background-position:0 56px!important;}


/* ステップ1-5見出し */
dl.dounyuu_step{margin:0 0 25px 0!important; background:transparent url(/typepad/images/omakase/line_dot.gif) repeat-x top left; padding:8px 0 0 0!important;}
dl.dounyuu_step dd{margin:5px 0 0 0!important;}
dl.dounyuu_step h3{height:18px; width:548px; display:block; overflow:hidden; text-indent:-10000em; font-size:1px!important; line-height:0;}

	h3.step1{background-image:url(/typepad/images/omakase/dounyuu_ttl_step1.gif)!important;}
	h3.step2{background-image:url(/typepad/images/omakase/dounyuu_ttl_step2.gif)!important;}
	h3.step3{background-image:url(/typepad/images/omakase/dounyuu_ttl_step3.gif)!important;}
	h3.step4{background-image:url(/typepad/images/omakase/dounyuu_ttl_step4.gif)!important;}
	h3.step5{background-image:url(/typepad/images/omakase/dounyuu_ttl_step5.gif)!important;}

/* 導入PDF */
dl.dounyuu_pdf{margin:0 0 25px 0!important; background:transparent url(/typepad/images/omakase/line_dot.gif) repeat-x top left; padding:10px 0 0 0!important;}
dd.btn_pdf a{
	width:243px;
	height:52px;
	display:block;
	text-indent:-10000em;
	overflow:hidden;
	background-image:url(/typepad/images/omakase/dounyuu_btn_pdf.gif);
	margin:10px 0 0 0!important;
	}
dd.btn_pdf a:hover{background-position:0 -52px;}




/*================================================
tpo-price.html（価格/購入方法ページ）
================================================*/
h3.kakaku{background-image:url(/typepad/images/omakase/kakaku_ttl.gif)!important; height:22px; width:396px; display:block; overflow:hidden; text-indent:-10000em; margin:0 0 5px 0!important;}

div#kakaku_buy			{background:transparent url(/typepad/images/omakase/kakaku_buy_bg.gif) repeat-y; width:548px; margin:25px 0 0 0!important;}
div#kakaku_buy h4		{width:548px; height:43px; display:block; text-indent:-10000em; background-image:url(/typepad/images/omakase/kakaku_buy_ttl.gif); margin:0 0 10px 0!important;}
div#kakaku_buy p		{padding:0 18px!important;}
div#kakaku_buy_bottom	{height:10px; display:block; line-height:0; font-size:0.1px; background-image:url(/typepad/images/omakase/kakaku_buy_bottom.gif)!important;}


/* 購入ボタン */
div#kakaku_buy p.btn a{height:52px; width:243px; display:block; overflow:hidden; background-image:url(/typepad/images/omakase/kakaku_buy_btn.gif); text-indent:-10000em; margin:10px 0!important;}
div#kakaku_buy p.btn a:hover{background-position:0 -52px;}



/*================================================
tpo-sample.html（サンプルページ）
================================================*/
dl.sample dt{margin-bottom:5px!important;}
dl.sample h3{background-image:none!important; font-size:80%!important; margin-bottom:5px!important;}

/* ボタン */
dl.sample dd a			{text-indent:-10000em; font-size:1px!important; line-height:0; height:52px; width:243px; display:block; overflow:hidden;}
dl.sample dd a:hover	{background-position:0 -52px;}
dl.sample dd.btn_demo a		{background-image:url(/typepad/images/omakase/sample_btn_demo.gif)!important; margin-bottom:25px!important;}
dl.sample dd.btn_design a	{background-image:url(/typepad/images/omakase/sample_btn_design.gif)!important;}




/*================================================
tpo-faq.html（よくあるご質問ページ）
================================================*/
dl.qa{background:transparent url(/typepad/images/omakase/line_dot.gif) repeat-x bottom left; padding-bottom:25px!important; margin-bottom:15px!important;}

dl.qa h3{height:15px; width:548px; display:block; text-indent:-10000em; font-size:1px!important; line-height:0; margin-bottom:5px!important;}
	h3.question1{background-image:url(/typepad/images/omakase/qa_q01.gif)!important;}
	h3.question2{background-image:url(/typepad/images/omakase/qa_q02.gif)!important;}
	h3.question3{background-image:url(/typepad/images/omakase/qa_q03.gif)!important;}
	h3.question4{background-image:url(/typepad/images/omakase/qa_q04.gif)!important;}

/*================================================
add css
================================================*/
div#TPmain h2 {
  width: 548px;
  height: 25px;
  margin: 10px 0 20px;
  line-height: 1;
  text-indent: 0;
  background-image: none !important;
  border-bottom: solid 1px #ccc;
}

div#TPmain h2 span {
  position: relative;
  padding-bottom: 4px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  border-bottom: solid 4px #5f8999;
}

h2.top_h2 {
  font-size: 14px;
  font-weight: bold !important;
}

/* faq */

div#TPcontainer dl.qa h3 {
  width: 548px;
  height: auto;
  padding-left: 18px;
  margin-bottom: 10px;
  text-indent: 0;
  line-height: 1;
  font-size: 13px !important;
  font-weight: bold;
  background: transparent url(/typepad/images/omakase/icon-qa.png) no-repeat left center;
}

/* feature */
div#TPcontainer div.tokuchou h4 {
  display: block;
  width: 548px;
  height: 45px;
 _height: 60px;
  margin: 0 0 5px;
  padding: 15px 0 0 65px;
  text-indent: 0;
  line-height: 1;
  font-size: 16px;
  font-weight: bold;
  color: #A8B357;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: left top;
  border: none;
}

h4.point01 {
background-image:url(/typepad/images/omakase/tpo-tokucho01.png);
}

h4.point02 {
background-image:url(/typepad/images/omakase/tpo-tokucho02.png);
}

h4.point03 {
background-image:url(/typepad/images/omakase/tpo-tokucho03.png);
}

h4.point04 {
background-image:url(/typepad/images/omakase/tpo-tokucho04.png);
}

/* flow */
dl.dounyuu_step h3.step1,
dl.dounyuu_step h3.step2,
dl.dounyuu_step h3.step3,
dl.dounyuu_step h3.step4,
dl.dounyuu_step h3.step5 {
  font-weight: bold !important;
  background-image: none !important;
}

div#TPcontainer dl.dounyuu_step h3 {
  height: auto;
  font-size: 13px !important;
  text-indent: 0;
}

dl.dounyuu_step h3 span {
  margin-right: 5px;
  font-size: 11px;
  font-weight: bold;
  color: #5f8999;
}

/* top sidemenu */
div#mainContents div#visualArea {
  float: left;
  width: 553px;
  height: 310px;
  margin: 0;
  padding: 0;
}

div#mainContents div#visual-navi {
  float: left;
  width: 187px;
  height: 310px;
  background: transparent url(/typepad/images/omakase/tpo-visual-navi-bg.jpg) no-repeat left top;
}

div#mainContents div#visual-navi ul {
  width: 187px;
  margin: 0;
  padding-top: 1px;
}

div#mainContents div#visual-navi ul li {
  display: block;
  height: 44px;
}

div#mainContents div#visual-navi ul li a {
  display: block;
  height: 44px;
  margin: 0;
  padding: 0 0 0 30px;
  font-weight: bold;
  line-height: 3;
  text-decoration: none;
  background: transparent url(/typepad/images/omakase/tpo-menu-list-bg.jpg) no-repeat left top;
}

div#mainContents div#visual-navi ul li a:hover {
  color: #999999;
  background-position: right top;
}

div#TPcontainer {
  clear: both;
  float: none;
}

ul.snavi li.top a,ul.snavi li.tokucyou a,ul.snavi li.dounyuu a,ul.snavi li.kakaku a,ul.snavi li.sample a,ul.snavi li.partner a,ul.snavi li.kouchiku a,ul.snavi li.qa a {
  height: 33px;
  padding-left: 17px;
  font-weight: bold;
  line-height: 2.3;
  text-indent: 0;
  text-decoration: none;
  background: transparent url(/typepad/images/omakase/tpo-snavi-bg.gif) no-repeat left top;
}

li#current a {
  color: #999999;
  background-position: left bottom;
}

ul.snavi li.top a:hover,ul.snavi li.tokucyou a:hover,ul.snavi li.dounyuu a:hover,ul.snavi li.kakaku a:hover,ul.snavi li.sample a:hover,ul.snavi li.partner a:hover,ul.snavi li.kouchiku a:hover,ul.snavi li.qa a:hover {
  color: #999999;
  background-position: left bottom;
}

