﻿@charset "utf-8";

/*-----------------------------------------
SampleFan renewal

layout.css date:
2018/01/17 change:s_shimizu
2013/01/25 write:a_fujii

2014/04/03
memo: add date to suffix of file name
-----------------------------------------*/

#sfWrapper01{
	width:960px;
	margin:0 auto;
	padding:0 10px;
	background:#ffffff;
}

.box {
	cursor:pointer;
}

.border01 {
	margin:10px 0;
	background:url(/common/img/border01.gif) left top repeat-x;
	height:1px;
}

.borderYellow{
	margin-top:5px;
	border-top:solid 1px #e6d08d;
}

/*-------------------------------------
header
---------------------------------------*/


#sfWrapper01 #header {
	margin:7px auto 7px;
}

#sfWrapper01 #header h1{
	font-size:10px;
	color:#b2a28c;
	float:left;
}

#sfWrapper01 #header p#shortMenu{
	float:right;
}

#sfWrapper01 #header #hdrLogo{
	width:198px;
	float:left;
}

#sfWrapper01 #header #hdrAdBox01{
	width:728px;
	float:right;
}

/* noMenuHeader */
#sfWrapper01 #nomenuHeader{
	margin:30px 0 20px;
}


/*-------------------------------------
mainBox
---------------------------------------*/

#sfWrapper01 #mainBox{
	width:640px;
	float:left;
	margin-right:20px;
}


/* 2013/04/25 mod */
#mainBox .recommendArea{
	width:598px;
	padding:0 20px;
	background-color:#fef5df;
	margin-top:20px;
}

#mainBox .recommendTxt{
	background-color:#fef5df;
	border:1px solid #e9e0cd;
	margin-top:20px;
}

#mainBox .imgBox{
        padding:15px 20px 5px;
}

#mainBox .recommendLeft{
	width:290px;
	float:left;
}

#mainBox .recommendRight{
	width:290px;
	float:right;
}

#mainBox .recL{
	width:90px;
	float:left;
	margin-right:10px;
}

#mainBox .recR{
	width:190px;
	float:left;
}
#mainBox .recommendTxt h3{
	color:#666;
	font-weight:bold;
}

#mainBox .recommendTxt h4{
	color:#007ac0;
	font-weight:bold;
}

#mainBox .recommendBox{
	background-color:#fef5df;
	background:#fffaef;
	padding:10px 10px 5px 10px;
	margin: 0 20px;
}


/*-------------------------------------
result.html
detail.html
---------------------------------------*/


/*action*/

/*sample*/

#mainBox .cateInfo .action01{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #60cbe6;
	margin-right:10px;
	color:#60cbe6;
}


/*monitor*/

#mainBox .cateInfo .action02{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #58cf9b;
	margin-right:10px;
	color:#58cf9b;
}


/*trial*/

#mainBox .cateInfo .action03{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #fb98ad;
	margin-right:10px;
	color:#fb98ad;
}


/*product*/

#mainBox .cateInfo .action04{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #ffaf24;
	margin-right:10px;
	color:#ffaf24;
}


/*experience*/

#mainBox .cateInfo .action05{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #ce96eb;
	margin-right:10px;
	color:#ce96eb;
}

/*profit*/

#mainBox .cateInfo .action06{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #ff2357;
	margin-right:10px;
	color:#ff2357;
}

/*spare01*/

#mainBox .cateInfo .action07{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #ff6347;
	margin-right:10px;
	color:#ff6347;
}

/*spare02*/

#mainBox .cateInfo .action08{
	padding:2px 3px;
	font-size:10px;
	background-color:#fff;
	border:solid 1px #94847f;
	margin-right:10px;
	color:#94847f;
}


/*-------------------------------------
sideBox
---------------------------------------*/

#sfWrapper01 #sideBox{
	width:300px;
	float:left;
}

/* NEWS */
#newsBox {
	width:283px;
	padding:5px 5px 0 10px;
	background-color:#fffcf1;
	line-height:200%;
	border-top:solid 1px #fc7497;
	border-right:solid 1px #fc7497;
	border-left:solid 1px #fc7497;
}

#newsBox ul.newsBoxtxt li {
	padding-left: 3em;
	text-indent: -3em;
}

#newsBox a{
	text-decoration:none;
	color:#666;
}

#newsBox span.info{
	text-decoration:underline;
	color:#007ac0;
}
#newsBox .update{
	color: #fd8092;
	font-size: 12px;
	text-align: right;
	margin-right: 5px;
	margin-top: 5px;
	/*	margin-bottom: 5px;*/
}
#newsBox .pickup{
	animation: 1.5s ease-in-out 0s alternate none infinite running blink;
	/*background:#fd8092;*/
	background:#d0354b;
	padding:1px 4px;
	margin-right:3px;
	color:#FFF;
	font-size:12px;
	border-radius:3px;
	font-weight:bold;
}
@-webkit-keyframes blink {
0% {
    opacity: 0;
}
100% {
    opacity: 1;
}
}
@keyframes blink {
0% {
    opacity: 0;
}
100% {
    opacity: 1;
}
}

/* contentBox */

#sideBox .cntnt01Box {
	width:300px;
	background:url(/common/img/side_cntnt01_bg.gif) left top repeat-y;
	margin-top:15px;
}

.cntnt01Box > h3{
	width:280px;
	background:url(/common/img/side_cntnt01_top01.gif) left top no-repeat;
	padding:6px 10px;
}

.cntnt01Box h3.cntnt01Tit{
	width:280px;
	background:url(/common/img/side_cntnt01_top02.gif) left top no-repeat;
	padding:6px 10px;
	margin-top:10px;
}

.cntnt01Box #sideLoginBox {
	width:270px;
	margin:10px auto 0;
}

.cntnt01Box #sideLoginBox input{
	width:170px;
	border:1px solid #cccccc;
	background:#ffffff;
	padding:3px;
	margin-top:5px;
	ime-mode: inactive; /* hankakuMode */
}

span.placeholder {
	top:8px;
	left:5px;
	fontSize:100%;
	lineHeight:100%;
	textAlign:left;
	color:#bbb;
	overflow:hidden;
	position:absolute;
	zIndex:99;
}

.cntnt01Box #sideLoginBox .sloginL{float:left; width:180px;}
.cntnt01Box #sideLoginBox .sloginR{float:right; width:80px;}
.cntnt01Box #sideLoginBox .sloginR input{
	width:80px;
	opacity:1.0;
	filter: alpha(opacity=100);
	height:49px;
	padding:0;
	border:none;
}
.cntnt01Box #sideLoginBox .sloginR input:hover{
	opacity:0.7;
	filter: alpha(opacity=70);
}

.cntnt01Box .sidelogin_bdot{
	background:url(/common/img/sidelogindot.gif) repeat-x bottom left;
	padding-bottom:10px;
}


/* sideadmission */
.cntnt01Box .admssnBtn{
	opacity:1.0;
	filter: alpha(opacity=100);
	text-align:center;
	margin-top:10px;
}

.cntnt01Box .admssnBtn:hover{
	opacity:0.7;
	filter: alpha(opacity=70);
}

/* sideLogin */

#sideLoginBox .loginBtn {
	text-align:center;
}

#sideLoginBox .loginBtn input{
	opacity:1.0;
	filter: alpha(opacity=100);
	width:114px;
	height:33px;
	padding:0;
	border:none;
}

#sideLoginBox .loginBtn input:hover{
	opacity:0.7;
	filter: alpha(opacity=70);
}


#sideBox .cntnt01Box .welcome{
	margin-top:5px;
	text-align:center;
	line-height:150%;
}


#sideBox .cntnt01Box p.member span.name{
	padding-left:15px;
	background:url(/common/img/member_icon.gif) left center no-repeat;
}
#sideBox .mgt15 .mgb10 img{max-width:100%;height:auto;}


/* searchform */

#searchform { 
    position: relative;
	margin-top:15px;
}

#keywords{  
    width:237px;  
    height:23px;
	background:url(/common/img/side_search_bg.gif) left top no-repeat;
	border:none;
    padding:5px;  
	font-size:14px;
	line-height:20px; 
}

#searchform input[type="text"] {
	color:#000000;
}

#searchform input.textFocus {
	color:#666666;
}
  
#searchBtn{  
    position: absolute;  
    top: 0;  
    _top: 1px;  
    left: 237px;  
}  
*:first-child + html #searchBtn {  
    top: 1px;  
} 

ul.hotWord {
	margin-top:5px;
}

ul.hotWord li{
	display:inline;
	margin-right:10px;
	word-break:keep-all;
}

.fb-like-box {
	margin-top:15px;
}



/* rankingTab */

#rankingTab {
	width:300px;
	margin-top:15px;
	background:url(/common/img/side_rank_bg01.gif) left top repeat-y;
}

#rankingTab ul#ulTab, #rankingTab ul#ulTab li {
	margin:0;
	padding:0;
	list-style:none;
	list-style-image:none;
	list-style-position:outside;
	line-height:0;
}

#rankingTab a{display: block;}

#rankingTab ul#ulTab {
	padding:10px 10px 0;
	border-bottom:1px solid #50abdf;
}

#rankingTab ul#ulTab li{
	float:left;
	margin-right:5px;
}

#rankingTab #tab-box p.fame{
	text-align:right;
	font-size:12px;
	padding:5px 5px 0 0;
}

#rankingTab #tab-box p.fame a{
	display:inline;
	color:#af7e15;
	padding-left:13px;
	background:url(/common/img/star_gold.gif) left center no-repeat;
}


#tab-box div {
display:none;
}

#rankingTab .rankingActive{
	width:266px;
	background:url(/common/img/side_rank_bg02.gif) left top repeat-y;
	padding:10px;
	margin:0 7px;
}

#rankingTab ul.rankingActive li.popular{
	width:123px;
	float:left;
}

#rankingTab ul.rankingActive li.access{
	width:123px;
	float:right;
}

#rankingTab ul.rankingActive li.popular dl, #rankingTab ul.rankingActive li.access dl{
	margin-top:10px;
}

#rankingTab ul.rankingActive li.popular dt, #rankingTab ul.rankingActive li.access dt{
	font-weight:bold;
	display:block;
}

#rankingTab ul.rankingActive li.popular dd, #rankingTab ul.rankingActive li.access dd{
	text-align:center;
	padding-top:3px;
	font-size:10px;
	display:block;
}

#rankingTab .rankingActive dd{
	opacity:1.0;
	filter: alpha(opacity=100);
}

#rankingTab .rankingActive dd:hover{
	opacity:0.7;
	filter: alpha(opacity=70);
}

/*--Instagram--*/
.sesamyInsta{
	border:1px solid #e9ebee;
	padding:10px 10px 5px;
}
.sesamyInsta .profile{
	overflow:hidden;
	margin-bottom:10px;
}
.sesamyInsta .profile h3{
	float:left;
	width:57px;
	margin-right:10px;
	display:block;
}
.sesamyInsta .profile .profileText{
	width:200px;
	float:left;
}
.sesamyInsta .profile .profileText a{
	font-weight:bold;
	font-size:18px;
	color:#333;
	text-decoration:none;
	margin-bottom:5px;
}
.sesamyInsta .profile .profileText a:hover{
text-decoration:underline;
}


/*-------------------------------------
Research
---------------------------------------*/
#ques-tab-box p.researched{
        text-align:right;
        font-size:12px;
        padding:5px 5px 0 0;
}

#ques-tab-box p.researched a{
        display:inline;
        color:#0e90a7;
        padding-left:13px;
        background:url(/common/img/researched.gif) left center no-repeat;
}



/*-------------------------------------
searchCategory
---------------------------------------*/

#searchCategory {
	width:640px;
	margin-top:20px;
}

#searchCategory h3{
	background:url(/common/img/search_cate_bg01.gif) left top no-repeat;
	padding:8px 0 6px 22px;
}

#searchCategory #srchCateBox{
	width:620px;
	background:url(/common/img/search_cate_bg02.gif) left top repeat-y;
	padding:10px 10px 7px;
}

#searchCategory #srchCateBox .iconCate{
	width:25px;
	float:left;
	margin-right:5px;
}

#searchCategory #srchCateBox h4{
	width:85px;
	float:left;
	font-weight:bold;
	margin-right:10px;
}

#searchCategory #srchCateBox a:link{ color:#666666; text-decoration:underline;}
#searchCategory #srchCateBox a:visited{ color:#666666; text-decoration:underline;}
#searchCategory #srchCateBox a:hover{ color:#999999; text-decoration:underline;}
#searchCategory #srchCateBox a:active{ color:#999999; text-decoration:underline;}

#searchCategory #srchCateBox ul.cateList{
	width:495px;
	float:left;
}

#searchCategory #srchCateBox ul.cateList li{
	float:left;
	margin-right:10px;
	line-height:22px;
}

#searchCategory #srchCateBox ul.cateList li a{
	background:url(/common/img/icon_arrow03.gif) left center no-repeat;
	padding-left:14px;
}


/*-------------------------------------
footer
---------------------------------------*/


#footer {
	margin-top:10px;
	background: url(/common/img/footer_line01.gif) left top repeat-x #ffffff;
	padding:25px 0;
}

#footer #ftLogo {
	width:147px;
	float:left;
	margin-right:30px;
}

#footer #ftList {
	width:780px;
	float:left;
}

#footer #ftList dl.ftLink {
	margin-bottom:10px;
}

#footer #ftList dl.ftLink dt{
	width:90px;
	font-weight:bold;
	float:left;
	margin-right:20px;
}

#footer #ftList dl.ftLink dd{
	font-size:10px;
	float:left;
	margin-right:15px;
	background:url(/common/img/icon_arrow01.gif) left center no-repeat;
	padding-left:15px;
}

#footer #ftList dl.ftLink a{
	color:#666666;
	text-decoration:none;
}



#footer p.copy{
	color:#999999;
	text-align:center;
}



/*-------------------------------------
globalNavi
---------------------------------------*/

#sfWrapper01 ul#globalMenu{
	width:960px;
	margin:0 auto;
	display: table;
	table-layout:fixed;
	font-weight:bold;
	font-size: 14px;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

#sfWrapper01 ul#globalMenu li{
	display: table-cell;
	width : -webkit-calc(100% / 6) ;
    width : calc(100% / 6) ;
	background: linear-gradient(to bottom, #ff99a8, #fd8092);
	text-align:center;
	border-left: 1px solid #f3476b;
	border-right:1px solid #feb3be;
}
#sfWrapper01 ul#globalMenu li a{
	text-decoration: none;
	color: #FFF;
	display:block;
	padding:10px;
	text-shadow: 1px 1px 1px #f7475c;
}
#sfWrapper01 ul#globalMenu li a:hover{
	background: linear-gradient(to bottom, #ff7485, #ff6175);
	}
#sfWrapper01 ul#globalMenu li:first-child,#sfWrapper01 ul#globalMenu li:first-child a:hover{
border-left:none;
border-radius: 4px 0 0 4px;
}
#sfWrapper01 ul#globalMenu li:last-child,#sfWrapper01 ul#globalMenu li:last-child a:hover{
border-right:none;
border-radius: 0 4px 4px 0;
}


/*-------------------------------------
error
---------------------------------------*/


#errorBox {
	margin:45px auto 0;
}
	


/*-----------------------------------------
recommendArea02

layout.css date:2014/04/01 write:s_uemura
-----------------------------------------*/

/*-------------------------------------
recommendArea02
---------------------------------------*/

#mainBox #recommendArea02{
	background-color:#fffae7;
	margin-top:20px;
	border:1px solid #e9e0cd;
}

#mainBox #recommendArea02 .recommendWrap{
	width:598px;
	margin:10px 10px 0 20px;
	padding-bottom:10px;
}


#mainBox #recommendArea02 .recommendWrap .recommend02L{
	width:186px;
	float:left;
	text-align:center;
	margin-right:10px;
	border-right:1px dotted #d4b979;
	padding-right:9px;
}

#mainBox #recommendArea02 .recommendWrap .recommend02R{
	width:186px;
	float:left;
	text-align:center;
}


#mainBox #recommendArea02 .recommendWrap .recommend02L img,
#mainBox #recommendArea02 .recommendWrap .recommend02R img{
	border:5px solid #fde688;
}

#mainBox #recommendArea02 .recommendWrap .recommend02L,
#mainBox #recommendArea02 .recommendWrap .recommend02R{
	opacity:1.0;
	filter: alpha(opacity=100);
	zoom:1;	
}

#mainBox #recommendArea02 .recommendWrap .recommend02L a:hover,
#mainBox #recommendArea02 .recommendWrap .recommend02R a:hover{
	opacity:0.7;
	filter: alpha(opacity=70);
	zoom:1;	
	display:inline-block\9;
}

#mainBox #recommendArea02 .recommendWrap .recommend02L p,
#mainBox #recommendArea02 .recommendWrap .recommend02R p{
	font-size:12px;
	font-weight:bold;
	margin-top:5px;
	word-wrap:break-word;
}

#mainBox #recommendArea02 .recommendWrap .recommend02L p a,
#mainBox #recommendArea02 .recommendWrap .recommend02R p a{
	color:#666666;
	text-decoration:none;
}


#mainBox #recommendArea02 .recommendBox{
	background-color:#fffcf6;
	background:#fffcf6;
	padding:10px 10px 5px 10px;
	margin: 0 20px;
}

/*-----------------------------------------
 date:2014/04/03 write:s_uemura
-----------------------------------------*/
/*  prtxt  */
.prTxt01 {
	background:url(/common/img/pickup_bg.gif) left center no-repeat;
	margin-top:10px;
	font-weight:bold;
}

.prTxt01 a{
	color:#d88314;
	display:block;
	padding:10px 0 11px 167px;
}

.prTxt01 a:hover{
	color:#fabd45;
}

.closeInformation { 
	clear:both; /*念の為*/
	padding:15px;
	text-align: center;

}
.closeInformation h1 {
    float: none!Important;
    display: block;
    font-size: 20px!Important;
    color: #d0354b!Important;
    font-weight: bold;
}
.closeInformation p {
    font-size: 14px;
}
