@charset "UTF-8";
body { background: url(../images/bg_body_m1.jpg) repeat-x; }

#contentsAreaBody { overflow: hidden; }

#pageTitle { height: 60px; text-align: right; }
#pageTitle span { color: #fff; font-size: 22px; padding: 15px 0 0 0; display: block; }

#breadcrumb { overflow: hidden; font-size: 12px; margin: 15px 0; }
#breadcrumb li { float: left; padding: 0 10px 0 0; }
#breadcrumb li a, #breadcrumb li span { margin: 0 10px 0 0; }

.pageTitleChild { background: #ffcccc; border: 10px solid #fff; font-size: 20px; padding: 10px 20px 8px 20px; }

.post { background: #fff; padding: 0 30px 30px 30px; }
.post h2 { background: #ffcccc; font-size: 20px; padding: 10px 20px 8px 20px; margin: 0 0 20px 0; }
.post h3 { background: url(../images/bg_post_h3.png) no-repeat; width: 645px; height: 50px; font-size: 18px; color: #D11377; padding: 10px 0 0 65px; margin: 50px 0 15px 0; }
.post h3:first-child { margin: 0 0 15px 0; }
.post h3 a { color: #D11377; }
.post h3 a[target="_blank"] { background: url(../images/icon07.png) no-repeat right center; padding: 0 30px 0 0; }
.post h4 { background: url(../images/bg_title_border.png) left bottom repeat-x; padding: 0 0 5px; margin: 30px 0 10px; color: #D11477; }

.creator_page h3 { background: url(../images/bg_title_border.png) left bottom repeat-x; padding: 0 0 5px; margin: 30px 0 10px; color: #D11477; font-size: 16px; height: 20px; }

.post h4.largefont, .font140 { font-size: 140%; }

.font120 { font-size: 120%; }

.font80 { font-size: 80%; }

.post h5 { border-left: 5px solid #777; padding-left: 6px; margin: 0.8em 0; color: #777; }

.accordionTriger { cursor: pointer; }

.accordionh3 { cursor: pointer; background: url(../images/bg_accordion_triger.png) no-repeat !important; width: 625px !important; height: 43px !important; font-size: 18px !important; color: #D11377 !important; padding: 17px 0 0 85px !important; margin: 0 0 15px 0 !important; }
.accordionh3:hover { background: url(../images/bg_accordion_triger_on.png) no-repeat !important; }
.accordionh3.active { background: url(../images/bg_accordion_triger_active.png) no-repeat !important; }
.accordionh3.active:hover { background: url(../images/bg_accordion_triger_active_on.png) no-repeat !important; }

.accordionh5:hover { color: #D11577; text-decoration: underline; }

.accordionSection { display: none; }
.accordionSection.active { display: block; }

.navBelow { overflow: hidden; width: 100%; margin: 0 auto; }
.navBelow .navPre { display: block; float: left; width: 250px; height: 2.2em; text-align: left; }
.navBelow .navNext { display: block; float: right; width: 250px; height: 2.2em; text-align: right; }

.caution, .cautionBox1 { color: #cc0044; border: 1px solid #cc0044; padding: 10px 15px; background-color: #FFECF2; }

.cautionBox2 { color: #3350cc; border: 1px solid #3350cc; padding: 10px 15px; background-color: #F1F3FC; }

.cautionBox3 { border: 1px solid #3350cc; padding: 10px 15px; background-color: #fff; background-color: #FFECF2; }

.cautionBox2 h5 { font-weight: bold; color: #3350cc; border: none; clear: none; }
.cautionBox2 a { color: #3350cc; }

.promo { margin: 10px 15px; }

.caution2 { color: #cc0044; }

.caution3 { color: #3350cc; }

a.linkStyle1, .linkStyle1 a, .linkIcon { margin-left: 5px; padding-left: 18px; background: url(/wp/wp-content/themes/comipo_20140401/images/icon01.png) left no-repeat; }

p.linkStyle1:hover { text-decoration: underline; color: #D11577; }

.column2Area { width: 520px; overflow: hidden; }

.column2 { width: 250px; margin: 0 10px 10px 0; float: left; position: relative; }

.listSqureArrow li { background: url(../images/list_squre_arrow.jpg) left 2px no-repeat; padding: 0 0 0 25px; }

.listDisc { list-style: inside; text-indent: -1em; margin: 0 0 0 1em; }

.iconImg { margin: -2px 0 0 0; }

.tableStyle2, .tableStyle3 { border: 1px solid #CCC; margin: 0 auto; }

.tableStyle2 th { border: 1px solid #CCC; padding: 6px 8px; background-color: #EBEBEB; white-space: nowrap; }

.tableStyle3 th { border: 1px solid #CCC; padding: 6px 8px; background-color: #EBEBEB; white-space: nowrap; text-align: center; }

.tableStyle2 td, .tableStyle3 td { border: 1px solid #CCC; padding: 6px 8px; }

.booksTable { margin-bottom: 40px; }

td.listStyle1 a, .listStyle1 li { background: url(/wp/wp-content/themes/comipo_20140401/images/icon01.png) left no-repeat; padding-left: 18px; }

td.listStyle2 a, .listStyle2 li { background: url(../images/icon02.png) no-repeat left 0.3em; padding-left: 12px; }

td.listStyle3 a, .listStyle3 li { background: url(../images/icon01.png) no-repeat left 0.1em; padding-left: 17px; }

td.listStyle1 a { display: inline-block; color: #0000FF; text-decoration: underline; }
td.listStyle2 a, td.listStyle3 a { display: inline-block; }

a.listStyle1 { display: inline-block; background: url(/wp/wp-content/themes/comipo_20140401/images/icon01.png) left no-repeat; padding-left: 18px; }
a.listStyle2 { display: inline-block; background: url(../images/icon02.png) no-repeat left 0.3em; padding-left: 12px; }
a.listStyle3 { display: inline-block; background: url(../images/icon01.png) no-repeat left 0.1em; padding-left: 17px; }

.listStyle4 { margin: 0 0 0 25px; }
.listStyle4 li { list-style-type: disc; list-style-position: outside; line-height: 1.5; margin-bottom: 0.5em; }
.listStyle4 ul { margin: 0 0 0 25px; }
.listStyle4 ul li { list-style-type: circle; }
.listStyle4 ul li:first-child { margin-top: 0.5em; }
.listStyle4 ul ul li { list-style-type: square; }
.listStyle4 ul ul li:first-child { margin-top: 0.5em; }

.listStyle5 { margin: 0 0 0 25px; }
.listStyle5 li { list-style-type: decimal; list-style-position: outside; line-height: 1.5; }

.listStyle6 li { margin: 0 0 0.8em 0; background: url(../images/icon01.png) no-repeat left 2px; padding: 0 0 0 22px; }

.listStyle7 li { margin: 0 0 5px 30px; list-style: decimal; line-height: 1.4em; }

ul.notice { margin: 20px 0 0 20px; }
ul.notice li { padding-left: 1em; text-indent: -1em; }
ul.notice li:before { content: "* "; }

.rightfloat { float: right; margin: 0 0 10px 10px; }

.leftfloat { float: left; margin: 0 10px 10px 0; }

.center { margin-left: auto; margin-right: auto; text-align: center; }

.left { text-align: left; }

.right { text-align: right; }

body#top { background: url(../images/bg_body.jpg) repeat-x; }

#mainVisual { background: #2c86c2; width: 100%; height: 300px; position: absolute; left: 0; top: 125px; }
#mainVisual #mainVisualInner { width: 1020px; margin: 0 auto; height: 300px; }
#mainVisual #mainVisualInner #slider { width: 785px; height: 300px; float: right; }
#mainVisual #mainVisualInner #slider .slideCon1 { width: 785px; height: 300px; background: url(../images/bg_slide_con1.png); position: relative; }
#mainVisual #mainVisualInner #slider .slideCon1 #movie { position: absolute; top: 50px; right: 25px; }

#top #contentsAreaBody { margin: 325px 0 0 0; }

#contentsAreaBodyMain { width: 510px; float: left; }
#contentsAreaBodyMain .info { margin: 0 0 10px 0; }
#contentsAreaBodyMain .info .infoTitle { margin: 0 0 1px 0; height: 40px; position: relative; }
#contentsAreaBodyMain .info .infoTitle img { position: absolute; }
#contentsAreaBodyMain .info .infoTitle .infoMore { position: absolute; right: 10px; bottom: 5px; color: #fff; }
#contentsAreaBodyMain .info .infoTitle .infoMore a { color: #fff; font-size: 12px; }
#contentsAreaBodyMain .info .entryList { background: #ededed; padding: 15px; }
#contentsAreaBodyMain .info .entryList ul li { padding: 5px 0; }
#contentsAreaBodyMain .info .entryList ul.listDate li { overflow: hidden; }
#contentsAreaBodyMain .info .entryList ul.listDate li .date { float: left; display: block; width: 80px; }
#contentsAreaBodyMain .info .entryList ul.listDate li a { display: block; float: right; width: 400px; }
#contentsAreaBodyMain .link { margin: 0 0 10px 0; }
#contentsAreaBodyMain .link h2 { margin: 0 0 1px 0; }
#contentsAreaBodyMain .link .linkList { background: #ededed; padding: 15px; overflow: hidden; }
#contentsAreaBodyMain .link .linkList ul.listDisc { list-style: inside; text-indent: -1em; margin: 0 0 0 1em; float: left; }
#contentsAreaBodyMain .link .linkList ul.listDisc li { margin: -5px; padding: 7px 0; }
#contentsAreaBodyMain .link .linkList ul.link1 { width: 95px; padding: 0 34px 0 0; }
#contentsAreaBodyMain .link .linkList ul.link2 { width: 135px; padding: 0 30px 0 0; }
#contentsAreaBodyMain .link .linkList ul.link3 { padding: 0; width: 140px; }

#pickUp1 .column2 { color: #fff; padding: 0 0 30px 0; }
#pickUp1 .column2 .box { width: 210px; height: 300px; margin: 0 auto; }
#pickUp1 .column2 .box .btnMoreJa a { position: absolute; text-align: center; display: block; right: 0px; bottom: 0px; background: url(../images/bg_btn_more_ja.png); width: 72px; height: 18px; font-size: 11px; color: #fff; padding: 4px 10px 4px 10px; }
#pickUp1 .column2 .box .btnMoreJa a:hover { background: url(../images/bg_btn_more_ja_h.png); }
#pickUp1 .column2 .box ul { margin: 6px 0 6px 1em; }
#pickUp1 .column2 .box ul li { padding: 0 0 6px 0; }
#pickUp1 .pickUpImg { padding: 4px; margin: 0 0 10px 0; }
#pickUp1 .pickUpCon1 { background: #2e8ac8; }
#pickUp1 .pickUpCon1 .pickUpImg { background: url(../images/bg_pick_up_img1.jpg); }
#pickUp1 .pickUpCon2 { background: #e26a6b; }
#pickUp1 .pickUpCon2 .pickUpImg { background: url(../images/bg_pick_up_img2.jpg); }

#pickUp2 .column2 { background: #ededed; padding: 0 0 30px 0; }
#pickUp2 .column2 .btnMoreEn a { position: absolute; text-align: center; display: block; right: 0px; bottom: 0px; background: #8e8e8e; width: 72px; height: 18px; font-size: 11px; color: #fff; padding: 4px 10px 4px 10px; }
#pickUp2 .column2 .btnMoreEn a:hover { background: #555555; }
#pickUp2 .column2 .pickUpImg { padding: 0 10px 10px 10px; }
#pickUp2 .column2 .box { padding: 10px; height: 180px; }
#pickUp2 .pickUpCon1 .pickUpImg { background: #2e8ac8; }
#pickUp2 .pickUpCon1 .data_new { padding: 10px 0 0 0; }
#pickUp2 .pickUpCon1 .data_new img { float: left; margin: 0 10px 0 0; }
#pickUp2 .pickUpCon2 .pickUpImg { background: #099; }
#pickUp2 .pickUpCon2 ul { padding: 10px 0 0 0; }

#contentsAreaBodySide { width: 250px; float: right; }
#contentsAreaBodySide .banner { width: 217px; margin: 0 0 10px 0; }
#contentsAreaBodySide .banner ul li { margin: 0 0 10px 0; }

#socialMedia { margin: 0 0 10px 0; padding: 3px 0 0; height: 270px; border: 2px solid #e26a6a; background: #fff; }

#socialMediaInner { padding: 10px; }
#socialMediaInner ul li { padding: 4px 0 4px 4px; float: left; width: 100px; }

.caseList li { margin-left: -10px; padding-left: 0; list-style-type: disc; }

#share_btn { float: right; margin-bottom: 10px; }
#share_btn ul li { float: left; margin-right: 5px; }
#share_btn ul li.hatena { width: 120px; }
#share_btn ul li.twitter { width: 100px; }

li.googleplus #___plusone_0 { width: 70px !important; }

#share_btn ul li.facebook { width: 160px; }
#share_btn ul li.pocket { width: 80px; }

#share_btn_less { float: right; margin-bottom: 10px; }
#share_btn_less ul li { float: left; margin-right: 5px; }
#share_btn_less ul li.hatena_less { width: 85px; }
#share_btn_less ul li.twitter_less { width: 70px; }

li.googleplus_less #___plusone_0 { width: 30px !important; }

#share_btn_less ul li.facebook_less { width: 120px; }
#share_btn_less ul li.pocket_less { width: 60px; }

.fb-like iframe, .item-facebook-like iframe { z-index: 99; max-width: none !important; }

.aboutThumbs { width: 750px; overflow: hidden; }

.aboutSection { width: 335px; overflow: hidden; float: left; display: inline; margin: 0 39px 40px 0; }
.aboutSection .title { background: url(../images/bg_title_border.png) left bottom repeat-x; padding: 0 0 5px; margin: 0 0 10px; font-weight: bold; color: #D11477; border: none; }

#about h5 { background: url(../images/bg_title_border.png) left bottom repeat-x; padding: 0 0 5px; margin: 0 0 10px; font-weight: bold; color: #D11477; border: none; }

.aboutSection .aboutPhoto { width: 155px; float: left; }
.aboutSection .aboutText { width: 155px; float: right; display: block; }

#about h5 { clear: both; }
#about img { float: left; margin: 0px 20px 30px 0; }

.webcomicThumbs { width: 750px; overflow: hidden; }

.webcomicSection { width: 335px; height: 225px; overflow: hidden; float: left; display: inline; margin: 0 39px 20px 0; }
.webcomicSection .title { background: url(../images/bg_title_border.png) left bottom repeat-x; padding: 0 0 5px; margin: 0 0 10px; font-weight: bold; color: #D11477; }
.webcomicSection .webcomiPhoto { background: url(../images/webcomic_thumb.png) no-repeat; height: 154px; width: 110px; padding: 1px 11px 11px 1px; float: left; }
.webcomicSection .webcomiPhoto img { height: 154px; width: 110px; }
.webcomicSection .webcomiText { width: 195px; float: right; display: block; }
.webcomicSection .webcomiText p { margin-bottom: 10px; }

.addDates { margin-bottom: 24px; }
.addDates .imagesThumb { float: left; display: inline; }

.add_mainvisual { width: 300px; float: left; }
.add_mainvisual p { text-align: center; font-size: 12px; margin: 0; }

.addDates .imagesThumb ul { background: url(../images/click_to_enlarge.png) no-repeat 65px bottom; width: 250px; display: block; height: 178px; padding-right: 9px; }
.addDates .imagesThumb ul li { float: left; margin: 0 15px 0 0; display: inline; }
.addDates .textDatas { width: 450px; float: right; }

.textDatas2 { width: 390px; float: right; }

div.itemDatas2 { width: 390px; margin: 20px auto; }
div.itemDatas2 img:hover { opacity: 0.7; filter: alpha(opacity=70); }
div.itemDatas2 li { float: left; margin: 3px 5px; }

.addDates .updateTitle { background-color: #66CC66; font-weight: bold; line-height: 23px; padding: 0 0 0 6px; margin: 10px 0 10px; }
.addDates .body { background-color: #FDF1F5; border: 1px solid #FF99CC; padding: 10px; font-size: 12px; }
.addDates .price { margin: 0 0 10px; font-size: 16px; }
.addDates .update { line-height: 1.2; font-size: 86%; }
.addDates .update dd { background: url(../images/border_x3.png) repeat-x left bottom; padding: 0 0 10px 1em; margin: 0 0 10px; text-indent: -1em; }

.shoplistBanners ul { text-align: center; }
.shoplistBanners ul li { display: inline-block; margin: 0 10px 10px; width: 200px; }
.shoplistBanners ul li span { display: block; font-size: 12px; }
.shoplistBanners ul li img:hover { opacity: 0.8; filter: alpha(opacity=80); }

.itemimg { float: left; width: 210px; }

.itemtable { float: left; width: 480px; }

.contentsBox { margin-bottom: 30px; }
.contentsBox h5 { clear: none; }

.contentsImg { float: right; margin-left: 10px; margin-bottom: 40px; }

ul.comment { margin-top: 12px; font-size: 80%; clear: both; }
ul.comment p.title span { font-size: 120%; font-weight: bold; }
ul.comment span.webtech { font-size: 80%; font-weight: normal; }
ul.comment li { border: 1px solid #ddd; padding: 5px; margin-left: 5px; margin-bottom: 12px; width: 215px; height: 60px; float: left; line-height: 1.4em; }
ul.comment li.noborder { border: 0; margin-left: 7px; }
ul.comment li img { float: left; margin-right: 5px; }
ul.comment a { color: #444; text-decoration: none; }
ul.comment a:hover { color: #999; text-decoration: underline; }

div#anniversary div.title, div.title_recommend { margin-top: 3.0em; font-size: 130%; font-weight: bold; border-bottom: dashed 2px #666; margin-bottom: 1.0em; }
div#anniversary div.title_top { margin-top: 1.0em; }
div.title span, div.title_recommend span { font-weight: normal; font-size: 80%; }
div#anniversary a:hover img { opacity: 0.5; filter: alpha(opacity=50); }
div#anniversary p { margin-bottom: 1.4em; }

ul.listheight10 li { margin-bottom: 1em !important; }

div.title img, div.title_recommend img { float: left; margin: -5px 12px 5px 0; }
div.title:after, div.title_recommend:after { display: block; clear: both; height: 0; visibility: hidden; content: "."; }

table.eto { width: 100%; }
table.eto th { vertical-align: middle; font-weight: bold; }
table.eto td { text-align: center; }
table.table_evaluate { border: 1px solid #CCC; width: 100%; margin: 0 auto; }
table.table_evaluate th { border: 1px solid #CCC; padding: 6px 8px; background-color: #EBEBEB; white-space: nowrap; text-align: center; vertical-align: middle; font-weight: bold; }
table.table_evaluate td { border: 1px solid #CCC; padding: 6px 8px; text-align: center; vertical-align: center; }

div.evaluate_form { width: 60%; margin: 20px auto; border: 1px solid #333; padding: 15px; }
div.evaluate_form input { padding: 8px; }
div.evaluate_form input[type="submit"] { margin-left: 20px; padding: 8px 15px; }

ul.creator li { float: left; margin: 0 20px; width: 200px; height: 200px; text-align: center; }

div.imagesThumb2 { float: left; width: 240px; }
div.imagesThumb2 img { float: left; margin-left: 5px; }
div.imagesThumb2 ul { background: url(../images/click_to_enlarge.png) no-repeat 65px bottom; width: 250px; display: block; height: 178px; padding-right: 9px; }
div.item_info { margin: 1em; }
div.item_info table { width: 450px; }
div.packages { padding-bottom: 4em; }

.formTable p { padding: 5px 0; }
.formTable th { border: 1px solid #999; vertical-align: middle; }

td { border: 1px solid #999; vertical-align: middle; }

.formTable th { background: #eee; font-weight: bold; color: #555; width: 25%; }
.formTable span.error { color: #d22; }
.formTable span.error:before { content: "▲ "; }
.formTable input[type="text"], .formTable textarea { font-family: inherit; margin: 5px; padding: 5px; font-size: 18px; width: 90%; }
.formTable select { font-family: inherit; margin: 5px; padding: 5px; font-size: 16px; width: 60%; }
.formTable label { margin: 0 20px 20px 0; }
.formTable input[type="checkbox"] { margin: 2px 5px 0 0; }

.submitBtn { margin: 10px auto; text-align: center; }
.submitBtn input[type="submit"] { padding: 5px 20px; font-size: 16px; }

div.sitemap ul { margin: 0; padding: 0; list-style-type: none; }
div.sitemap li { line-height: 23px; padding-left: 25px; background: url(/image/sm_line2.png) no-repeat 0 0; }
div.sitemap li.last { line-height: 23px; padding-left: 25px; background: url(/image/sm_line3.png) no-repeat 0 0; }
div.sitemap ul { background: url(/image/sm_line1.png) no-repeat 0 -150px; }
div.sitemap ul.child1 { background: url(/image/sm_line1.png) no-repeat 0 -900px; }
div.sitemap ul.child2 { background: url(/image/sm_line1.png) no-repeat 0 -800px; }

table.pressmaterial th { font-weight: bold; }
table.pressmaterial td { vertical-align: middle; line-height: 2em; }
table.pressmaterial td.thumb { padding: 10px; text-align: center; }

div#newsAreaList { background: #fff; padding-bottom: 40px; }
div#newsAreaList dl { padding: 0 10px; }
div#newsAreaList dt { clear: left; float: left; width: 6.5em; padding: 10px 1em; }
div#newsAreaList dd { margin: 0; padding: 10px 1em 10px 6.5em; border-bottom: 1px dashed #ccc; }

.pressrelease2010 p { margin-bottom: 2em; }

.pressrelease .tableOuter { display: table; width: 90%; }
.pressrelease .tableInner { display: table-cell; }
.pressrelease .sales_site { display: table; margin-bottom: 0.5em; }
.pressrelease .sales_site li { display: table-cell; width: 150px; background: url(/wp/wp-content/themes/comipo_20140401/images/icon01.png) left no-repeat; padding-left: 22px; }

div.newsAreaListfooter { padding: 10px 10px 0; }
div.newsAreaListfooter div.old { margin-left: 80px; float: left; }
div.newsAreaListfooter div.new { margin-right: 80px; float: right; }

table.pr20110427 { width: 90%; margin: 10px auto; border: none; }
table.pr20110427 th { font-size: 120%; padding: 10px; background-color: #eee; font-weight: bold; }
table.pr20110427b th { font-size: 120%; padding: 10px; background-color: #eee; font-weight: bold; }
table.pr20110427 td { padding: 20px; }
table.pr20110427 td.arrow img { margin-left: 80px; text-align: center; }
table.pr20110427b { margin: 20px auto; }
table.pr20110427b th, table.pr20110427b td { padding: 10px; vertical-align: middle; text-align: center; }
table.pr20110427b tr.caption td { padding-top: 0; text-align: center; }
table.w500 { width: 500px !important; }

div.web_bookmark li { margin: 0; width: 110px; float: right; }

.opacity a:hover { opacity: 0.6; filter: alpha(opacity=60); }

ul.pr_img_list li { float: left; margin: 20px 5px; }

.pressrelease h2.prtitle { background-color: #fff; padding: 30px 0; text-align: center; font-weight: bold; font-size: 120%; }
.pressrelease h4 { font-size: 120%; }
.pressrelease p { margin-bottom: 20px; }
.pressrelease table { width: 90%; margin: 20px 0; }

.catchcopy { font-size: 16px; font-weight: bold; color: #777; margin: 10px 20px 0; }

div.tips { padding-top: 20px; }
div.tips .su-spoiler { font-weight: bold; color: #555; padding: 0; margin: 0; background: #eee; border: 1px solid #999; margin-top: -1px; }
div.tips .top { border: 1px solid #999; }
div.tips .su-spoiler { background-color: #FFf3f3; }
div.tips .su-spoiler-title { font-size: 120%; margin-top: 10px; margin-bottom: 10px; }
div.tips .su-spoiler-content { margin: 0; padding: 20px 20px 20px 40px; background: #fff; font-weight: normal; border-top: 1px dotted #999; }
div.tips p { line-height: 1.6em; margin-bottom: 1em; }
div.tips li { line-height: 1.4em; margin-left: 2em; margin-bottom: 0.7em; }
div.tips ol { list-style: decimal; }
div.tips ul { list-style: disc; }

#material2d p { margin-bottom: 1em; }
#material2d ul.sampleThumb { display: block; margin-bottom: 20px; }
#material2d ul.sampleThumb li { float: left; margin: 0 20px 0 0; }
#material2d h4 { margin-top: 30px; }

ul.col2 { margin-left: 50px; }
ul.col2 li { float: left; margin: 0 5px 5px 0; }
ul.col2 li:last-child { clear: both; margin-bottom: 30px; }

#contentsAreaBody a img:hover { opacity: 0.6; }

.recommendIndex { position: relative; display: block; padding: 10px; margin: 5px; width: 45%; float: left; height: 50px; background-color: #eee; }
.recommendIndex:hover { background-color: #ccc; }
.recommendIndex a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-decoration: none; }
.recommendIndex img { float: left; margin-right: 10px; }
.recommendIndex p { margin: 0; }
.recommendIndex .recommendTitle { font-size: 80%; line-height: 1em; margin-bottom: 0.5em; }
.recommendIndex .recommendName { font-size: 120%; font-weight: bold; }

.row2 { line-height: 1.1em; }

.recommendBody { margin-bottom: 2em; }
.recommendBody img { float: left; padding-right: 10px; }
.recommendBody h4 { color: #666; font-size: 18px; font-weight: bold; background-image: none; display: block; padding-bottom: 10px; border-bottom: 2px dotted #999; }
.recommendBody h4 span { font-size: 80%; font-weight: normal; }
.recommendBody h4 span br { display: none; }
.recommendBody h4 .row2 span { line-height: 1em; }
.recommendBody:after { content: ""; display: block; clear: both; }
.recommendBody .recommendText img { float: none; }

.tagcloud { word-break: keep-all; line-height: 3em; margin-bottom: 30px; }
.tagcloud a { text-decoration: none; padding: 5px 8px; margin: 3px 3px; border: 1px solid #999; background: #ffcccc; border-radius: 5px; }
.tagcloud a:hover { background: #ddaaaa; color: #333; }
.tagcloud br { display: none; }

.tips_content { padding: 15px 20px; margin-bottom: 15px; border: 1px solid #999; background: #eee; }
.tips_content p:last-child { margin-bottom: 0 !important; }

.tips_item { background: #eee; padding: 20px; margin: 15px 0; box-sizing: border-box; position: relative; color: #333; }
.tips_item a { text-decoration: underline; }
.tips_item img { max-width: 310px; height: auto; }
.tips_item .tips_item_id { font-weight: bold; font-size: 40px; color: #333; text-align: right; opacity: 0.175; position: absolute; right: 5px; bottom: 5px; }

.price_box { position: relative; padding: 10px 20px; margin-bottom: 20px; background: #ffffff; border: 1px #ffcccc solid; clear: both; height: 160px; display: block; transition: background-color .4s; }
.price_box:after { clear: both; }
.price_box:hover { background: #ffcccc; }
.price_box .item_img { float: left; }
.price_box .item_img img { height: 155px; width: auto; }
.price_box .item_img img:hover { opacity: 1 !important; }
.price_box .item_text { padding: 20px; margin-left: 130px; }
.price_box .item_text p.item { font-size: 18px; font-weight: bold; }
.price_box .more { font-weight: bold; font-size: 16px; position: absolute; bottom: 10px; right: 10px; opacity: 0; transition: opacity .4s .3s; }

.lineup a, .lineup a:hover { text-decoration: none; }

.lineup a:hover .more { opacity: 1; }