pc.assets-cosme.net
Open in
urlscan Pro
13.225.183.6
Public Scan
URL:
https://pc.assets-cosme.net/css/general/common.css?69848add90cb6ac99782661a9107167e77d47f47
Submission: On August 28 via manual from JP — Scanned from JP
Submission: On August 28 via manual from JP — Scanned from JP
Form analysis 0 forms found in the DOM
Text Content
@charset "Shift_JIS";
/* -----------------------------------------------------------
CSS Information
Site URL: https://www.cosme.net/
File name: common.css
Created: 2010-08-16
by Author Style Info: ＠ｃｏｓｍｅ共通
----------------------------------------------------------- */
/* -----------------------------------------------------------
Table of Contents
* reset
* font
* clearfix
* general
* layout
* tag-line
* common modules 汎用モジュール
* 購入サイトへボタン
* ショッピングボタン：大
* ショッピングボタン：中
* ショッピングボタン：小
* 商品をクリップボタン：大
* 商品をクリップボタン：小
* クチコミ平均点
* レビュアーのクチコミ評価点
* ベストコスメ
* NEWアイコン
* UPアイコン
* ランキングINアイコン
* Facebookアイコン
* もっとみる
* ページトップ
* cosmeトップへ
* ページング：cmn-modules-paging
* ページング：cmn-paging
* エラー表示
* clip popup
* sub common modules subエリア汎用モジュール
----------------------------------------------------------- */
/** reset -------------------------------------------------**/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; -webkit-text-decoration-skip:none; }
div { display: block; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }
img { vertical-align:bottom; }
/** font関連 ----------------------------------------------**/
body {
font-size:13px; /* for modern */
line-height: 1.25;
font-family: "メイリオ","Meiryo","ＭＳ Ｐゴシック",Verdana,"ヒラギノ角ゴシック",Hiragino Sans,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,sans-serif;
}
* html body {/* IE6 */
font-size:80%;
line-height: 1.35;
}
*:first-child+html body {/* IE7 */
line-height: 1.35;
}
/** clearfix ----------------------------------------------**/
.clearfix { zoom:1; }
.clearfix:after { content:"."; display:block; height:0px; clear:both; visibility:hidden; }
/** general -----------------------------------------------**/
a:link { color: #068681; text-decoration: underline; }
a:visited { color: #709293; text-decoration: underline; }
a:hover { color: #07B0A9; text-decoration: underline; }
a:active { color: #07B0A9; text-decoration: underline; }
/** layout ------------------------------------------------**/
#container { width: 950px; margin: 0 auto; position: static; }
#tagline { width: 950px; margin-bottom: 4px; padding: 4px 0 4px; border-bottom: 1px dotted #ccc; }
#header-sub { width: 950px; }
#main { float: left; width: 635px; }
#sub-left { float: left; width: 165px; }
#main-right { float: right; width: 770px; }
#main-col { float: left; width: 455px; }
#sub { float: right; width: 300px; margin: 0 0 30px 0; }
/** common modules 汎用モジュール ------------------------**/
/* 購入サイトへボタン */
a.btn-cmn-buy {
overflow: hidden;
display: inline-block;
width: 75px;
height: 0;
padding-top: 15px;
background: url("/images/general/common/product_icons/btn_buy.png") no-repeat;
line-height: 2;
}
.ranking .btn-cmn-buy,
.keyword .btn-cmn-buy {
width: 111px;
padding-top: 18px;
}
.ranking .btn-cmn-buy {
background: url("/images/general/common/product_icons/btn_buy_rnk.png") no-repeat left top;
}
.keyword .btn-cmn-buy {
background: url("/images/general/common/product_icons/btn_buy_kwd.png") no-repeat left top;
}
html>body a:hover.btn-cmn-buy {
filter: alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}
/* ショッピングボタン：大 */
a.btn-cmn-spg-lrg {
overflow: hidden;
display: inline-block;
width: 120px;
height: 0;
padding-top: 24px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat 0 -63px;
line-height: 2;
}
html>body a:hover.btn-cmn-spg-lrg {
filter: alpha(opacity=85);
-moz-opacity: 0.85;
opacity: 0.85;
}
/* ショッピングボタン：中 */
a.btn-cmn-spg {
overflow: hidden;
display: inline-block;
width: 110px;
height: 0;
padding-top: 15px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat 0 -48px;
line-height: 2;
}
html>body a:hover.btn-cmn-spg {
filter: alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}
/* ショッピングボタン：小 */
a.btn-cmn-spg-sml {
overflow: hidden;
display: inline-block;
width: 52px;
height: 0;
padding-top: 16px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat -36px -30px;
line-height: 2;
}
html>body a:hover.btn-cmn-spg-sml {
filter: alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}
/* 商品をクリップボタン：大 */
a.btn-cmn-product-clip {
overflow: hidden;
display: inline-block;
width: 110px;
height: 0;
padding-top: 15px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat 0 0;
line-height: 2;
}
html>body a:hover.btn-cmn-product-clip {
filter: alpha(opacity=65);
-moz-opacity: 0.65;
opacity: 0.65;
}
.btn-cmn-product-clip-off {
overflow: hidden;
display: inline-block;
width: 110px;
height: 0;
padding-top: 15px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat 0 -15px;
line-height: 2;
}
/* 商品をクリップボタン：小 */
a.btn-cmn-product-clip-sml {
overflow: hidden;
display: inline-block;
width: 18px;
height: 0;
padding-top: 18px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat 0 -30px;
line-height: 2;
}
html>body a:hover.btn-cmn-product-clip-sml {
filter: alpha(opacity=65);
-moz-opacity: 0.65;
opacity: 0.65;
}
.btn-cmn-product-clip-sml-off {
overflow: hidden;
display: inline-block;
width: 18px;
height: 0;
padding-top: 18px;
background: url("/images/general/common/product_icons/btn_csm.png") no-repeat -18px -30px;
line-height: 2;
}
/* クチコミ平均点 */
.reviewer-average {
padding-left: 105px;
background: url("/images/general/common/review_star/ico_review_star_average.png") no-repeat;
font-weight: bold;
font-size: 100%;
line-height: 1;
}
.reviewer-average.arg-0 { background-position: 0 -139px;}
.reviewer-average.arg-0_5 { background-position: 0 -158px; }
.reviewer-average.arg-1 { background-position: 0 0; }
.reviewer-average.arg-1_5 { background-position: 0 -178px; }
.reviewer-average.arg-2 { background-position: 0 -19px; }
.reviewer-average.arg-2_5 { background-position: 0 -198px; }
.reviewer-average.arg-3 { background-position: 0 -39px; }
.reviewer-average.arg-3_5 { background-position: 0 -218px; }
.reviewer-average.arg-4 { background-position: 0 -59px; }
.reviewer-average.arg-4_5 { background-position: 0 -238px; }
.reviewer-average.arg-5 { background-position: 0 -79px; }
.reviewer-average.arg-5_5 { background-position: 0 -258px; }
.reviewer-average.arg-6 { background-position: 0 -99px; }
.reviewer-average.arg-6_5 { background-position: 0 -278px; }
.reviewer-average.arg-7 { background-position: 0 -119px; }
/* レビュアーのクチコミ評価点 */
.reviewer-rating {
background: url("/images/general/common/review_star/ico_review_star_all.png") no-repeat;
font-weight: bold;
font-size: 105%;
line-height: 1.25;
}
.reviewer-rating.rtg-0 {
background: none;
}
.reviewer-rating.rtg-1 {
padding-left: 17px;
background-position: 0 0;
}
.reviewer-rating.rtg-2 {
padding-left: 31px;
background-position: 0 -19px;
}
.reviewer-rating.rtg-3 {
padding-left: 45px;
background-position: 0 -39px;
}
.reviewer-rating.rtg-4 {
padding-left: 60px;
background-position: 0 -59px;
}
.reviewer-rating.rtg-5 {
padding-left: 74px;
background-position: 0 -79px;
}
.reviewer-rating.rtg-6 {
padding-left: 89px;
background-position: 0 -99px;
}
.reviewer-rating.rtg-7 {
padding-left: 102px;
background-position: 0 -119px;
}
/* ベストコスメ */
.icon-cmn-bestcosme {
display: inline-block;
overflow: hidden;
width: 70px;
height: 0;
padding-top: 16px;
background: url("/images/general/common/ranking_icons/ico_csm_bestcosme.png") no-repeat left top;
}
/* NEWアイコン */
span.icon-cmn-new {
display: inline-block;
overflow: hidden;
width: 26px;
height: 0;
margin-left: 2px;
padding-top: 11px;
background: url("/images/general/common/product_icons/ico_csm.png") no-repeat left -11px;
}
/* UPアイコン */
span.icon-cmn-up {
display: inline-block;
overflow: hidden;
width: 26px;
height: 0;
margin-left: 2px;
padding-top: 11px;
background: url("/images/general/common/icons/ico_up.png") no-repeat left top;
}
/* ランキングINアイコン */
.icon-cmn-rankingin {
display: inline-block;
overflow: hidden;
width: 70px;
height: 0;
padding-top: 15px;
background: url("/images/general/common/ranking_icons/ico_csm_rankingin.png") no-repeat left top;
}
/* Facebook icon */
.icon-cmn-fb {
display: inline-block;
overflow: hidden;
width: 15px;
height: 0;
padding-top: 15px;
line-height: 2;
background: url("/images/general/common/icons/ico_fb.png") no-repeat 0 0;
vertical-align: bottom;
}
/* もっとみる */
.cmn-viewmore {
padding-right: 7px;
background: url("/images/general/common/icons/viewmore_ico.png") no-repeat 100% 50%;
}
/* ページトップ */
.pagetop a {
font-size: 95%;
padding-left: 11px;
background: url("/images/general/common/icons/icon_pagetop.png") no-repeat left center;
}
.pagetop a:visited {
color: #068681;
}
.pagetop a:hover {
color: #07b0a9;
}
/* @cosmeトップへ */
.icon-rtn-top {
text-align: center;
}
.icon-rtn-top a {
display: inline-block;
padding-right: 15px;
min-height: 9px;
background: url("/images/general/common/icons/ico_arw_back.png") no-repeat right center ;
}
* html .icon-rtn-top a {
height: 9px;
}
/* ページング：cmn-modules-paging */
.cmn-modules-paging {
padding: 8px 0;
font-size: 95%;
line-height: 1;
}
.cmn-modules-paging p {
padding-top: 2px;
float: left;
color: #555;
}
.cmn-modules-paging ul {
float: right;
margin-top: 1px;
}
.cmn-modules-paging li {
display: inline;
}
.cmn-modules-paging .current {
font-weight: bold;
}
.cmn-modules-paging .page-more {
padding: 0 1px;
}
.cmn-modules-paging .back {
padding: 0 3px 0 14px;
background: url("/images/general/common/icons/ico_paging_back.png") no-repeat left;
}
.cmn-modules-paging .next {
padding: 0 12px 0 3px;
background: url("/images/general/common/icons/ico_paging_next.png") no-repeat right;
}
.cmn-modules-paging .first {
color: #999;
margin-right: 2px;
padding-right: 7px;
border-right: 1px dotted #bdb8ad;
}
* html .cmn-modules-paging .first {
margin-right: 6px;
padding-right: 2px;
}
*:first-child+html .cmn-modules-paging .first {
margin-right: 6px;
padding-right: 2px;
}
.cmn-modules-paging .last {
color: #999;
margin-left: 2px;
padding-left: 7px;
border-left: 1px dotted #bdb8ad;
}
/* ページング：cmn-paging */
.cmn-paging {
padding: 8px 0 7px;
font-size: 95%;
line-height: 1;
text-align: center;
}
.cmn-paging p {
padding-top: 2px;
color: #555;
text-align: left;
}
.cmn-paging ul {
display: inline-block;
margin: 5px auto 0;
}
* html .cmn-paging ul {
display: inline;
zoom: 1;
}
.cmn-paging li {
display: inline;
color: #a9a9a9;
line-height: 1.4;
}
.cmn-paging li a {
color: #666;
}
.cmn-paging li a:visited {
color: #999;
}
.cmn-paging li a:hover {
color: #07b0a9;
}
.cmn-paging .current {
color: #666;
font-weight: bold;
}
.cmn-paging .page-more {
padding: 0 1px;
color: #666;
}
.cmn-paging .back {
padding: 0 3px 0 1px;
}
.cmn-paging .back a {
padding-left: 10px;
background: url("/images/general/common/icons/ico_paging_back.png") no-repeat left;
}
.cmn-paging .next {
padding: 0 1px 0 3px;
zoom: 1;
}
html>/**/body .cmn-paging .next { display: inline-block; }
.cmn-paging .next a {
padding-right: 10px;
background: url("/images/general/common/icons/ico_paging_next.png") no-repeat right;
}
.cmn-paging .first {
margin-right: 2px;
padding-right: 7px;
border-right: 1px dotted #bdb8ad;
}
* html .cmn-paging .first {
margin-right: 6px;
padding-right: 2px;
}
*:first-child+html .cmn-paging .first {
margin-right: 6px;
padding-right: 2px;
}
.cmn-paging .last {
margin-left: 2px;
padding-left: 7px;
border-left: 1px dotted #bdb8ad;
}
/* エラー表示 */
.cmn-null {
min-height: 120px;
height: auto !important; /* min-heightクロスブラウザ対応用important */
height: 120px;
width: auto;
padding: 0 0 0 120px;
background: #fff url("/images/general/common/bg/bg_csm_error.png") no-repeat left 5px;
font-size: 108%;
line-height: 1.3;
word-wrap: break-word;
}
.cmn-null .cmn-null-head {
margin: 0 0 5px 0;
padding: 20px 0 0 0;
font-weight: bold;
}
.cmn-null .cmn-null-head strong {
font-weight: bold;
}
.cmn-null .cmn-null-hint {
background: #f8e9ee;
margin: 10px 0 0 0;
padding: 5px 15px 0 15px;
font-size: 82%;
overflow: hidden;
}
* html .cmn-null .cmn-null-hint {
padding-bottom: 5px;
}
.cmn-null .cmn-null-hint li {
margin: 0 0 5px 0;
padding: 0 0 0 10px;
background: url("/images/general/common/icons/ico_list_brn.png") no-repeat 0 6px;
}
/* clip popup */
#clipPopup {
width: 256px;
font-size: 95%;
font-weight: bold;
line-height: 1.4;
text-align: left;
}
#clipPopup .close {
text-indent: -9999px;
}
#clipPopup .close a {
display: block;
overflow: hidden;
height: 23px;
background: url(/images/general/common/popup/flm_clip.png) no-repeat left top;
}
#clipPopup .clipPopupBoxWide{
padding: 10px 15px 5px;
background: url(/images/general/common/popup/flm_clip.png) repeat-y center top;
}
#clipPopup .clipPopupBoxBottom {
padding-bottom: 10px;
background: url(/images/general/common/popup/flm_clip.png) no-repeat right bottom;
}
#clipPopup ul li {
float: left;
padding: 8px 15px 8px 0;
}
#clipPopup ul li a {
padding-left: 8px;
background: url(/images/general/common/icons/arrow_dot_green.png) no-repeat left center;
font-weight: normal;
}
#clipPopup .question {
clear: left;
padding-top: 5px;
border-top: 1px dotted #CCCCCC;
font-size: 85%;
font-weight: normal;
}
#clipPopup .question a {
padding-left: 15px;
background: url(/images/general/common/icons/ico_question_01.png) no-repeat left center;
color: #666;
}
#clipPopup .question a:hover {
color: #07B0A9;
}
#clipPopup .error{
color: #E33;
}
#clipPopup .ps{
color: #666666;
font-size: 85%;
}
/** sub common modules subエリア汎用モジュール -------------------**/
#special-banner,
#campaign-banner,
#sub-what-new,
#sub-present,
#sub-new-brand,
#sub-ranking,
#sub-hot-topics {
margin: 0 0 20px;
background: url("/images/general/common/bg/bg_csm_sub_title.png") no-repeat left top;
line-height: 1.3;
padding: 2px 0px;
}
#special-banner .title,
#campaign-banner .title,
#sub-what-new .title,
#sub-present .title,
#sub-new-brand .title,
#sub-ranking .title,
#sub-hot-topics .title {
padding: 5px 0 10px 18px;
font-size: 105%;
font-weight: bold;
color: #333;
}
#sub-what-new .title strong,
#sub-present .title strong,
#sub-new-brand .title strong,
#sub-ranking .title strong,
#sub-hot-topics .title strong {
font-weight: bold;
}
#sub-what-new .title a:link,
#sub-what-new .title a:visited,
#sub-present .title a:link,
#sub-present .title a:visited,
#sub-new-brand .title a:link,
#sub-new-brand .title a:visited {
color: #333;
text-decoration: none;
}
#sub-what-new .title a:hover,
#sub-present .title a:hover,
#sub-new-brand .title a:hover {
color: #07B0A9;
text-decoration: underline;
}
#sub-what-new .more ,
#sub-present .more ,
#sub-new-brand .more ,
#sub-ranking .more {
margin: 0 5px;
text-align:right;
}
/*pr-banner*/
#pr-banner {
margin-bottom: 20px;
text-align: center;
}
#pr-banner.pr-banner-hide {
display:none;
}
/*campaign-banner*/
#campaign-banner {
margin-bottom: 14px;
}
#campaign-banner p {
margin-top: 10px;
}
#campaign-banner .title {
font-size: 100%;
margin-top:0;
}
/*special-banner*/
#special-banner {
margin-bottom: 14px;
}
#special-banner .title {
font-size: 100%;
}
/*what-new*/
#sub-what-new ul {
margin: 0 9px;
}
#sub-what-new li {
border-bottom: 1px dotted #bfb7ac;
margin: 0 0 5px 0;
padding: 0 0 7px 15px;
color: #666;
background: url("/images/general/common/icons/icon_ball_green.png") no-repeat left 6px;
font-size: 95%;
word-wrap: break-word; /* IE 5+ */
}
#sub-what-new li a {
margin-right: 5px;
text-decoration: none;
}
#sub-what-new li a:hover {
text-decoration: underline;
}
#sub-what-new li .icon-csm-up {
margin: 1px 0 2px 3px;
}
/*sub-present*/
#sub-present .pre-wrap {
display: block;
padding-left: 10px;
padding-right: 10px;
text-decoration: none;
outline: none;
cursor: pointer;
}
#sub-present .pre-wrap span {
display: block;
}
#sub-present .bn-txt {
float: right;
width: 183px;
}
#sub-present .bn-ttl {
margin-bottom: 5px;
font-weight: bold;
text-decoration: underline;
}
#sub-present .comment {
color: #333;
}
#sub-present .bn-ol .more {
padding-top: 10px;
text-decoration: underline;
}
#sub-present .pre-img {
display: block;
float: left;
}
#sub-present a:hover img {
opacity: 0.7;
filter: alpha(opacity=70);
}
/*sub-new-brand*/
#sub-new-brand ul{
margin: 0 10px;
}
#sub-new-brand li{
zoom: 1;
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px dotted #bfb7ac;
}
#sub-new-brand li:after {
content: ".";
display: block;
height: 0px;
clear: both;
visibility: hidden;
}
/*sub-ranking*/
#sub-ranking .photo {
display: inline;
width: 72px;
float: right;
margin: 0 10px 0 0;
text-align: center;
}
#sub-ranking img {
border: 1px solid #ccc;
}
html>body #sub-ranking img:hover {
opacity: 0.7;
filter: alpha(opacity=70);
}
#sub-ranking .photo span {
display: block;
font-size: 95%;
}
#sub-ranking .category {
float: left;
width: 190px;
margin: 10px 0 5px 10px;
font-size: 112%;
}
#sub-ranking .category a:link,
#sub-ranking .category a:visited {
color: #333;
}
#sub-ranking .category a:hover {
color: #07B0A9;
}
#sub-ranking ol {
float: left;
width: 190px;
margin: -7px 0 5px 10px;
}
#sub-ranking li {
padding: 7px 0 7px 37px;
border-bottom: 1px dotted #ccc;
color: #999;
font-size: 95%;
}
#sub-ranking li.no1 {
background:url("/images/general/common/ranking_icons/ico_sub_ranking_s_01.png") no-repeat 0% 50%;
}
#sub-ranking li.no2 {
background:url("/images/general/common/ranking_icons/ico_sub_ranking_s_02.png") no-repeat 0% 50%;
}
#sub-ranking li.no3 {
background:url("/images/general/common/ranking_icons/ico_sub_ranking_s_03.png") no-repeat 0% 50%;
}
#sub-ranking li a {
text-decoration: none;
}
#sub-ranking li a:hover {
text-decoration: underline;
}
#sub-ranking li a.item {
font-weight: bold;
font-size: 106%;
}
#sub-ranking .more {
clear: both;
}
/*sub-hot-topics*/
#sub-hot-topics {
position: relative;
margin-bottom: 40px;
}
#sub-hot-topics span{
position: absolute;
top: 6px;
right: 10px;
font-size: 83%;
}
/** #sub-facebook-aty ----------------------------------------------**/
#sub-facebook-aty {
margin-bottom: 18px;
}
/** #sub-twitter-wgt ----------------------------------------------**/
#sub-twitter-wgt h4 {
font-weight: bold;
}
/** ad ------------------------------------------------------------**/
#pr01 {
border: 1px solid #ddd;
}
#pr01 .pr01Title {
padding: 7px 10px;
border-bottom: 1px dotted #ddd;
font-weight: bold;
background: #f3f3f3;
}
#pr01 div {
padding: 10px;
}
#pr01 iframe {
margin: 10px;
}
/* 全社共通popup ----------------*/
#pf-pp {
position: absolute !important; /* product.css打ち消し用 */
z-index: 100;
width: 521px;
margin-left: 25px;
padding: 13px 28px;
border: 2px solid #755;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 1px 1px 3px #000;
-moz-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
background: #f9f7f1;
}
#pf-pp .close {
display: block;
overflow: hidden;
position: absolute;
top: -9px;
left: 560px;
width: 29px;
height: 0;
padding: 29px 0 0 5px;
background: url("/images/general/pc/dialog/ico_pf_pp.png") no-repeat 0 0;
cursor: pointer;
}
html>/**/body #pf-pp span {
padding /*\**/: 5px 0 0 5px\9;
}
#pf-pp .ttl {
width: 500px;
margin: 0 auto 5px;
color: #755;
font-size: 16px;
font-weight: bold;
text-align: center;
-webkit-text-size-adjust: none;
}
#pf-pp p {
width: 481px;
margin: 0 auto 12px;
font-size: 13px;
line-height: 1.6;
}
#pf-pp div {
text-align: center
}
#pf-pp div a {
display: inline-block;
width: 302px;
height: 45px;
background: url("/images/general/pc/dialog/ico_pf_pp.png") no-repeat 0 -54px;
color: #fff;
font-size: 15px;
font-weight: bold;
line-height: 45px;
text-decoration: none;
}
#pf-pp div a:hover {
filter: alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}