@charset "utf-8";
/*------------------------------------
PC版/モバイル版で見るボタン
--------------------------------------*/
#df_device {
margin:0 auto;
width:96%;
}
#df_device #df_deviceWrap p {
text-align:center;
font-size:1em;
font-weight:bold;
}
#df_device #df_deviceWrap {
display:block;
margin:10px auto 20px;
}
#df_device #df_deviceWrap #df_device {
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
border:solid 1px #565656;
}
#df_device #df_deviceWrap #df_btn {
overflow:hidden;
padding:0;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
border: solid 1px #b3b3b3;
padding: 1px;
}
#df_device #df_deviceWrap #df_btn li {
padding:0 0;
width:49.9%;
display:block;
cursor:pointer;
font-size:1em;
background:#444;
background: #f6f6f6;
background: -moz-linear-gradient(top, #f6f6f6 32%, #dbdbdb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(32%, #f6f6f6), color-stop(100%, #dbdbdb));
background: -webkit-linear-gradient(top, #f6f6f6 32%, #dbdbdb 100%);
background: -o-linear-gradient(top, #f6f6f6 32%, #dbdbdb 100%);
background: -ms-linear-gradient(top, #f6f6f6 32%, #dbdbdb 100%);
background: linear-gradient(to bottom, #f6f6f6 32%, #dbdbdb 100%);
text-align:center;
}
#df_device #df_deviceWrap #df_btn li span {
font-size:1.2em;
font-weight:bold;
color:#4f4f4f;
text-shadow:0 1px 1px rgba(255, 255, 255, 0.7);
display:inline-block;
}
#df_device #df_deviceWrap li#df_pc {
float:left;
-moz-border-top-left-radius: 4px;
-ms-border-top-left-radius: 4px;
-o-border-top-left-radius: 4px;
border-top-left-radius: 4px;
-moz-border-bottom-left-radius: 4px;
-ms-border-bottom-left-radius: 4px;
-o-border-bottom-left-radius: 4px;
border-bottom-left-radius: 4px;
}
#df_device #df_deviceWrap li#df_pc span {
background:url(../images/icon_view_pc.png) no-repeat 0px 50%;
padding:0 0 0 30px;
background-size:22px;
-webkit-background-size:22px 22px;/*Android2.1*/
}
#df_device #df_deviceWrap li#df_sp {
border-left-style:none;
float:right;
-moz-border-top-right-radius: 4px;
-ms-border-top-right-radius: 4px;
-o-border-top-right-radius: 4px;
border-top-right-radius: 4px;
-moz-border-bottom-right-radius: 4px;
-ms-border-bottom-right-radius: 4px;
-o-border-bottom-right-radius: 4px;
border-bottom-right-radius: 4px;
}
#df_device #df_deviceWrap li#df_sp span {
background:url(../images/icon_view_sp.png) no-repeat 0px 50%;
padding:0 0 0 23px;
background-size:16px;
-webkit-background-size:16px 26px;/*Android2.1*/
}
#df_device #df_deviceWrap #df_btn li.df_active {
font-weight:bold;
color:#fff;
background: #a5a5a5;
background: -moz-linear-gradient(top, #a5a5a5 35%, #bfbfbf 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(35%, #a5a5a5), color-stop(100%, #bfbfbf));
background: -webkit-linear-gradient(top, #a5a5a5 35%, #bfbfbf 100%);
background: -o-linear-gradient(top, #a5a5a5 35%, #bfbfbf 100%);
background: -ms-linear-gradient(top, #a5a5a5 35%, #bfbfbf 100%);
background: linear-gradient(to bottom, #a5a5a5 35%, #bfbfbf 100%);
}
#df_device #df_deviceWrap #df_btn li a {
display:block;
text-decoration:none;
color:#404040;
font-weight:bold;
padding:10px 0;
}
#df_device #df_deviceWrap #df_btn li.df_active a span {
color:#fff;
text-shadow:none;
}