@charset "UTF-8";
/* CSS Document */

/*ヘッダフッタ余白調整*/

div#wrapper div#nav {
  margin-bottom: 0px;
}
div#wrapper #footerNew {
  margin-top: 0px;
}

/*全体*/
div#wrapper div#clio_w #main {
  margin-top: 0px;
}
div#clio_w {
  background: url(../images/index/back_pink.gif);
  margin: 0;
  padding: 0 0 40px;
}
div#wrapper #clio_w #main .clear_c {
  margin: 0px;
  padding: 0px;
  clear: both;
}
div#wrapper div#clio_w #cpagetop {
  height: 30px;
  margin: 0;
  padding: 0;
}

/*-----------------------
      トップページ
------------------------*/

/* ナビ */

#top_nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 25px;
  margin-bottom: 10px;
}
/* flash */

/* flash以下 */
#clio_top div.flash {
  z-index: -9999;
}

#b_space {
  display: flex;
  gap: 25px;
  justify-content: center;
  align-items: center;
  margin: 15px 0;
}

#clio_top div#clio_w #news {
  height: 20px;
  width: 920px;
  background-color: #ffffff;
  margin: 0 0 15px 0;
  padding: 6px 20px;
  color: #82472e;
}
#clio_top div#clio_w .news_day {
  color: #9eca5a;
}

#clio_top #wrapper #clio_w #main #news img {
  margin-right: 25px;
}

/* Twitter facebook(プロフにも影響） */
#clio_top .fbtw {
  margin: 0px;
  padding: 0px;
  height: 50px;
  text-align: right;
  position: relative;
  width: 960px;
}
#clio div#navi {
  margin: -25px 0 0 0;
}
#clio h3.pagettl {
  margin: 5px 0 20px 0;
}
#clio p.read_txt {
  margin-left: 20px;
  margin-bottom: 20px;
}
#clio div.center {
  margin-bottom: 10px;
  text-align: center;
}
#clio table.mL55 {
  margin-left: 55px;
}

div.ttlL {
  width: 400px;
  float: left;
  margin-bottom: 50px;
}
div.ttlR {
  width: 127px;
  float: right;
}

div.floatC {
  clear: both;
}
div.floatL p.pdf {
  margin: 10px 0 5px 0;
}

p.clio_fb {
  width: 192px;
  margin: 0;
  top: 0px;
  right: 0px;
  position: absolute;
}
p.clio_tw {
  margin-top: 0px;
  position: absolute;
  top: 0px;
  right: 400px;
  width: 200px;
}
p.clio_is {
  margin-top: 0px;
  position: absolute;
  top: 0px;
  right: 200px;
  width: 200px;
}

p.clio_tw {
  _right: 200px;
}

#clio div#contents div.ttlL p.clio_tw iframe {
  width: 185px !important;
}
p.floatC {
  clear: both;
}

/*-----------------------
       2nd共通 
------------------------*/

div#wrapper #clio_right h5 {
  margin: 0 0 20px 10px;
}

/* ページトップへ */
.cpagetop {
  text-align: right;
  height: 19px;
  width: 700px;
}

/* 左　g_nav */
div#wrapper div#clio_w #clio_left {
  float: left;
  width: 180px;
  height: 600px;
  background: url(../images/second/left_back.gif) 0 0 no-repeat;
}

div#clio_left ul#navi {
  list-style: none;
  margin: 0 0 0 12px;
  padding: 0;
}
div#clio_left ul#navi li {
  margin-bottom: 18px;
}
div#clio_left ul#navi #navi_index {
  margin-top: 12px;
}

/* 右 大枠 */
div#clio_w div#clio_right {
  width: 760px;
  float: right;
  color: #82472e;
  line-height: 1.4em;
  letter-spacing: 1px;
}
div#clio_w div#clio_right_top {
  height: 25px;
  width: 760px;
  margin: 0;
  padding: 0;
  background: url(../images/second/right_top.gif) 0 0 no-repeat;
}
div#clio_w div#clio_right_bottom {
  height: 25px;
  width: 760px;
  margin: 0;
  padding: 0;
  background: url(../images/second/right_bottom.gif) 0 0 no-repeat;
}
div#clio_w div#clio_right_center600 {
  width: 700px;
  height: 550px;
  margin: 0;
  padding: 0 30px;
  background-color: #ffffff;
}
div#clio_w div#clio_right_center_auto {
  width: 700px;
  margin: 0;
  padding: 0 30px;
  background-color: #ffffff;
}

/* コンテンツタイトル */
div#clio_w div#clio_right .ttl_main {
  margin: 0 0 25px 0;
  padding: 0px;
}

/*-----------------------
     プロフィール 
		  clio_about
------------------------*/

#clio_about .fbtw {
  margin: 0px;
  padding: 0px;
  height: 50px;
  text-align: right;
  position: relative;
  width: 685px;
}
#clio_about .img01 {
  margin-bottom: 15px;
}

/*-----------------------
     クリ夫のおしごと 
		  clio_work
------------------------*/

/* 出張レポート大タイトル */
#clio_work div#clio_report {
  height: 205px;
  width: 700px;
  background: url(../images/work/back_report.jpg) 0 0 no-repeat;
  position: relative;
  margin: 0 0 30px 0;
}
#clio_work div#clio_report h4 {
  position: absolute;
  top: 20px;
  left: 15px;
  margin: 0;
  padding: 0;
}
#clio_work div#clio_report h5 {
  position: absolute;
  top: 73px;
  left: 25px;
  margin: 0;
  padding: 0;
}
#clio_work div#clio_report .yote {
  position: absolute;
  top: 100px;
  left: 25px;
  margin: 0;
  padding: 0;
  letter-spacing: 1px;
  line-height: 1.5em;
  width: 369px;
}
#clio_work div#clio_report .gotoreport {
  position: absolute;
  bottom: 15px;
  left: 35px;
  margin: 0;
  padding: 0;
}

/* 商品紹介枠 */
#clio_work div#presen {
  width: 700px;
  margin-bottom: 20px;
}
#clio_work div#presen_top {
  width: 700px;
  height: 17px;
  background: url(../images/work/waku_top.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
}
#clio_work div#presen_bottom {
  width: 700px;
  height: 17px;
  background: url(../images/work/waku_bottom.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
}
#clio_work div#presen_center {
  width: 660px;
  background: url(../images/work/waku_center.gif);
  margin: 0;
  padding: 0 20px;
}

/* 商品紹介中身 */
#clio_work div#presen .presen_ttl {
  margin: 0 0 10px 0;
}
#clio_work div#commodity {
  width: 660px;
  height: 280px;
  position: relative;
  color: #663333;
  line-height: 1.4em;
  letter-spacing: 1px;
  margin-bottom: 30px;
}
#clio_work .com01,
#clio_work .com02,
#clio_work .com03 {
  width: 180px;
  position: absolute;
  top: 0;
}
#clio_work .com01 {
  left: 10px;
}
#clio_work .com02 {
  left: 240px;
}
#clio_work .com03 {
  right: 10px;
}

#clio_work div#commodity img {
  margin-bottom: 7px;
}
#clio_work div#commodity a:hover {
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;
}
#clio_work div.clio_message {
  height: 183px;
  width: 535px;
  position: relative;
  margin-left: 70px;
  background: url(../images/work/clio01.jpg) 0 0 no-repeat;
  padding: 0 0 30px 0;
}
#clio_work .clio_message a {
  color: #e95711;
  display: block;
  position: absolute;
  bottom: 20px;
  left: 270px;
  text-decoration: underline;
}
#clio_work .clio_message a:hover {
  text-decoration: none;
}

/* 出張レポート枠 */
#clio_work div#report {
  width: 700px;
  margin-bottom: 40px;
}
#clio_work div#report_top {
  width: 700px;
  height: 45px;
  background: url(../images/work/report_top.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
}
#clio_work div#report_bottom {
  width: 700px;
  height: 15px;
  background: url(../images/work/report_bottom.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
}
#clio_work div#report_center {
  width: 660px;
  background: url(../images/work/report_center.gif);
  margin: 0;
  padding: 0 20px;
  position: relative;
}
#clio_work div#report .report_img {
  float: left;
  margin: 0;
}
#clio_work div#report .report_right {
  float: right;
  width: 380px;
  color: #82472e;
  line-height: 1.4em;
  letter-spacing: 1px;
}
#clio_work div#report h6 {
  margin-bottom: 30px;
  margin-top: 30px;
}
#clio_work div#report .txt01 {
  line-height: 1.5em;
  margin: 0 0 8px 0;
}
#clio_work div#report .txt02 {
  width: 250px;
}

/*-----------------------
    　クッキング 
		  clio_cooking
------------------------*/

/* 大タイトル */
#clio_cooking div#clio_cooktitle {
  height: 205px;
  width: 700px;
  background: url(../images/cooking/mainimage.gif) 0 0 no-repeat;
  position: relative;
  margin: 0 0 30px 0;
}
#clio_cooking div#clio_cooktitle .recipe_name {
  position: absolute;
  top: 120px;
  left: 80px;
  margin: 0;
  padding: 0;
}

/* 点線枠 */
#clio_cooking div#recipe {
  width: 700px;
  margin-bottom: 70px;
}
#clio_cooking div#recipe_top {
  width: 700px;
  height: 17px;
  background: url(../images/work/waku_top.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
  position: relative;
}
#clio_cooking div#recipe_bottom {
  width: 700px;
  height: 17px;
  background: url(../images/work/waku_bottom.gif) 0 0 no-repeat;
  margin: 0;
  padding: 0;
}
#clio_cooking div#recipe_center {
  width: 660px;
  background: url(../images/work/waku_center.gif);
  margin: 0;
  padding: 0 20px;
}

/* 枠内の内容 */
#clio_cooking div#recipe .ttl_zairyo {
  position: absolute;
  top: -30px;
  left: 5px;
}
#clio_cooking div#recipe .ryouri_img01 {
  float: right;
  margin: 0;
}
#clio_cooking div#recipe .zairyo_list {
  float: left;
  margin-right: 18px;
  margin-top: 40px;
  padding: 0 0 0 30px;
  font-size: 90%;
  width: 400px;
}
#clio_cooking div#recipe .zairyo_list li {
  list-style: url(../images/cooking/maru.gif);
}
#clio_cooking div#recipe .zairyo_list p {
  margin: 0 0 5px 0;
}

#clio_cooking div#recipe .making {
  float: left;
  margin-top: 40px;
  padding: 0 0 0 0;
  font-size: 90%;
  width: 320px;
}
#clio_cooking div#recipe .ryouri_img02 {
  float: right;
  margin: 40px 0 0 0;
}

/* 手順ulナンバー */
#clio_cooking .making li {
  list-style: none;
  width: 320px;
  margin: 0 0 5px 0;
  padding-left: 25px;
  padding-bottom: 8px;
}
#clio_cooking .making .no01 {
  background: url(../images/cooking/no01.gif) 0 2px no-repeat;
}
#clio_cooking .making .no02 {
  background: url(../images/cooking/no02.gif) 0 2px no-repeat;
}
#clio_cooking .making .no03 {
  background: url(../images/cooking/no03.gif) 0 2px no-repeat;
}
#clio_cooking .making .no04 {
  background: url(../images/cooking/no04.gif) 0 2px no-repeat;
}
#clio_cooking .making .no05 {
  background: url(../images/cooking/no05.gif) 0 2px no-repeat;
}
#clio_cooking .making .no06 {
  background: url(../images/cooking/no06.gif) 0 2px no-repeat;
}
#clio_cooking .making .no07 {
  background: url(../images/cooking/no07.gif) 0 2px no-repeat;
}
#clio_cooking .making .no08 {
  background: url(../images/cooking/no08.gif) 0 2px no-repeat;
}
#clio_cooking .making .no09 {
  background: url(../images/cooking/no09.gif) 0 2px no-repeat;
}
#clio_cooking .making .no10 {
  background: url(../images/cooking/no10.gif) 0 2px no-repeat;
}
#clio_cooking .making .no11 {
  background: url(../images/cooking/no11.gif) 0 2px no-repeat;
}
#clio_cooking .making .no12 {
  background: url(../images/cooking/no12.gif) 0 2px no-repeat;
}
#clio_cooking .making .no13 {
  background: url(../images/cooking/no13.gif) 0 2px no-repeat;
}
#clio_cooking .making .no14 {
  background: url(../images/cooking/no14.gif) 0 2px no-repeat;
}
#clio_cooking .making .no15 {
  background: url(../images/cooking/no15.gif) 0 2px no-repeat;
}

/*-----------------------
    　ダウンロード 
		  clio_download
------------------------*/

#clio_dl #clio_w p.serif {
  margin-bottom: 25px;
  margin-top: 10px;
}

/* トップdownload.shtml */
#clio_cooking #clio_right #recipe01 {
  margin-bottom: 45px;
}
#clio_download div#select {
  position: relative;
  height: 205px;
  width: 700px;
  margin-bottom: 30px;
  margin-top: 50px;
}
#clio_download div#select .select_menu01,
#clio_download div#select .select_menu02,
#clio_download div#select .select_menu03 {
  width: 170px;
  height: 205px;
  position: absolute;
  top: 0;
}
#clio_download div#select .select_menu01 {
  left: 50px;
}
#clio_download div#select .select_menu02 {
  left: 265px;
}
#clio_download div#select .select_menu03 {
  right: 50px;
}
#clio_download #clio_w #clio_right .clio_comment {
  margin: 0 0 0 110px;
}

/* ぬりえ */
div#c2012,
div#past {
  padding: 10px 0 0 35px; /*background:url("../images/download/nurie/back_color_mdl.gif") repeat-y;margin:*/
}
div#dl_all {
  padding: 20px 0 0 25px; /*background:url("../images/download/nurie/back_color_mdl.gif") repeat-y;*/
}

div#c2012 div.floatL {
  width: 140px;
  float: left;
  text-align: center;
  margin: 0 40px 10px 0;
}
div#dl_all div.floatL2 {
  width: 160px;
  float: left;
  text-align: center;
  margin: 0 20px 10px 0;
  font-size: 85%;
  letter-spacing: 0px;
}

div#dl_all div.floatL2 a {
  color: #663300;
  text-decoration: none;
}
div#dl_all div.floatL2 a:hover {
  text-decoration: underline;
}

div#c2012 div.floatL p.month,
div#dl_all div.floatL2 p.month {
  margin-bottom: 5px;
}
div#c2012 div.floatL p.color {
  margin-bottom: 30px;
  line-height: 1.5em;
  font-size: 85%;
}
div#c2012 div.floatL p.colorB {
  margin-bottom: 0;
  line-height: 1.5em;
  font-size: 85%;
}
div#c2012 div.floatLr {
  margin: 40px 0 10px 0;
}
div#dl_all div.floatLr {
  margin: 30px 0 10px 0;
}

div#c2012 div.floatR {
  width: 180px;
  float: right;
  margin: 0 40px 10px 0;
}

div#past div.floatL {
  width: 111px;
  float: left;
  text-align: center;
  margin: 0 20px 10px 0;
}
div#past div.floatL p.pdf {
  margin: 10px 0 30px 0;
}
div#dl_all div.floatL2 p.size {
  margin: 10px 0 30px 0;
}

div#past div.floatL p.pdfB {
  margin: 10px 0 0 0;
}
div#past div.floatLr {
  margin: 0 0 10px 0;
}
#clio_dl #dl_w {
  margin: 0 0 40px 60px;
  background: url("../images/download/nurie/back_color_mdl.gif") repeat-y;
}
#clio_dl .year {
  margin: 0px;
  padding: 0px;
}
#clio_dl .mL55 {
  margin: 10px 0 30px 70px;
  border-top: dotted 1px #999999;
  width: 550px;
}

#clio_dl .floatL2 .size {
  margin-top: 8px;
  line-height: 1.6em;
}

/*-----------------------
    　ゲーム
		clio_game
------------------------*/
#clio_game #game_w {
  margin-left: 10px;
  margin-bottom: 30px;
}
#clio_game #rule {
  margin-bottom: 30px;
}

#clio_game div#rule .sousa_w {
  position: relative;
  width: 640px;
  margin-bottom: 30px;
  margin-left: 30px;
}
#clio_game div#rule .sousa_t {
  width: 400px;
  margin: 10px 0 0 0;
}
#clio_game div#rule .sousa_img {
  position: absolute;
  right: 10px;
  top: -20px;
}

#clio_game div#rule .absolute01 {
  position: relative;
  width: 670px;
  height: 120px;
  margin-left: 30px;
}
#clio_game div#rule .absolute01 p {
  position: absolute;
  margin: 0;
}

#clio_game div#rule .absolute01 .ten01 {
  top: 0;
  left: 0;
}
#clio_game div#rule .absolute01 .ten02 {
  top: 0;
  left: 180px;
}
#clio_game div#rule .absolute01 .ten03 {
  top: 0px;
  left: 420px;
}
#clio_game div#rule .absolute01 .ten04 {
  top: 60px;
  left: 0;
}
#clio_game div#rule .absolute01 .ten05 {
  top: 60px;
  left: 180px;
}
#clio_game div#rule h4 {
  text-align: center;
  margin-bottom: 20px;
}
#clio_game #clio_right #rule .txt01 {
  margin-bottom: 15px;
  margin-left: 25px;
  width: 660px;
}

#clio_game #clio_w #clio_right #rule .line01 {
  margin-bottom: 15px;
}

/*-----------------------
    　キャンペーン
		clio_campaign
------------------------*/
#clio_campaign #clio_w #clio_right #present {
  width: 700px;
  position: relative;
  height: 400px;
}
#clio_campaign #present .kabegami {
  width: 300px;
  position: absolute;
  left: 20px;
  top: 0px;
  text-align: center;
}
#clio_campaign #present .nurie {
  width: 300px;
  position: absolute;
  right: 20px;
  top: 0px;
  text-align: center;
}
#clio_campaign #clio_w #clio_right .txt01 {
  margin-top: 20px;
  margin-bottom: 13px;
}
#clio_campaign #clio_w #clio_right #present img {
  margin-bottom: 10px;
}
#clio_campaign .kabegami a,
#clio_campaign .nurie a {
  color: #82472e;
  text-decoration: none;
  font-size: 90%;
}
#clio_campaign .kabegami a:hover,
#clio_campaign .nurie a:hover {
  text-decoration: underline;
}
#clio_campaign #clio_w #main #clio_right #present p {
  margin-bottom: 4px;
}