@charset "utf-8";

/*-------------------------------------------------------------------
    * research.css
    * site name : チャンスイット
    * description : アンケート
    * import : web/research/***.jsp
-------------------------------------------------------------------*/

/* お知らせ */
.information{
    width:950px;
    margin:15px auto 10px;
    overflow:hidden;
}
.information h2,
.information a{
    float:left;
}
.information h2{
    text-align:center;
    width:110px;
    box-sizing:border-box;
    height:35px;
    font-size:16px;
    font-weight:bold;
    padding:6px 0 0;
    background:#f94f5a;
    color:#fff;
}
.information a{
    box-sizing:border-box;
    width:840px;
    padding:5px 15px;
    display:block;
    text-decoration:none;
    color:#666;
    font-size:15px;
    border-top:1px solid #bdbdbd;
    border-right:1px solid #bdbdbd;
    border-bottom:1px solid #bdbdbd;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.information a:hover{
    transition: all 0.8s;
    background-color:#fff8d6;
}

#wrapper{
    font-family: "Meiryo","メイリオ","ＭＳ　Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
}
#wrapper #main{
    float:right;
    width:690px;
    padding-bottom: 10px;
}
#container{
    overflow:hidden;
    margin-top:10px;
}
#main,#sub{
    margin:10px 0 0;
}
#main a{
    display:inline-block;
    text-decoration:none;
    color:#4d4d4d;
}
#main a:hover,#sub a:hover,#main input:hover{
    text-decoration:none;
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    background:#fff8d6;
}
#main p, #main h3{
    color:#4d4d4d;
}
#main h2{
    font-size:18px;
    font-weight:bold;
}
#main .date{
    background: #f3f0e6;
    border: 1px solid #d3d1c8;
}
#main .pt{
    color:#ff5555;
    display:inline-block;
    background: url(../img/icon/ico-pt.gif) center left no-repeat;
    font-weight:bold;
    font-size:18px;
}
#main .page{
    padding:14px 0;
    text-align:center;
}
#main .page strong{
    padding:3px 10px;
    border:#f3e8c0 1px solid;
    background:#fff8de;
}
#main .page a{
    padding:3px 10px;
    border:#e0e0e0 1px solid;
    background:#fff;
}
#main .page a:hover{
    background: #f8f8f8;
    color: #6cf;
}

/*----------------------------------------------
左サイド
----------------------------------------------*/
#sub {
    float:left;
    width: 250px;
}
#sub .game_list {
  margin-bottom: 10px;
}
#sub .game_list h2 {
  font-size:18px;
  font-weight:bold;
  border-top:2px solid #ff5555;
  padding:10px 8px;
  overflow:hidden;
}
#sub .game_list li{
    margin-bottom: 10px;
}
#sub .game_list li:last-child {
    margin-bottom: 20px;
}
#sub .game_list li a:hover{
    opacity:0.6;
    background:none;
}

/*----------------------------------------------
ショップ系アンケート
----------------------------------------------*/
#main .reserch_shop{
    margin-bottom: 20px;
    border-top: #ff5555 3px solid;
    border-bottom: #ccc 1px solid;
    border-left: #ccc 1px solid;
    border-right: #ccc 1px solid;
    border-radius: 2px;
    background: url(../img/10/research/bg_shopresearch.gif) repeat 0 0;
}
#main .reserch_shop h2{
    text-align:center;
    margin: 1px 0 10px;
    padding: 10px 0 0;
    border-top: #ff5555 1px solid;
}
#main .reserch_shop ul{
    margin:7px 0 0;
    padding:0 10px;
}
#main .reserch_shop ul li{
    border:#c5c5c5 solid 1px;
    overflow:hidden;
    margin:0 0 7px;
    background:#fff;
}
#main .reserch_shop ul li a{
    overflow:hidden;
    display:block;
}
#main .reserch_shop ul li p{
    float:left;
    text-align:center;
}
#main .reserch_shop ul li .date{
    width:80px;
    margin:7px;
}
#main .reserch_shop ul li h3{
    color:#4d4d4d;
    float:left;
    max-width:450px;
    margin:7px 7px 0 7px;
    font-size:13px;
    font-weight:bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#main .reserch_shop ul li .pt{
    float:right;
    margin:2px 15px 0;
    padding: 0 0 0 20px;
}

/*----------------------------------------------
オススメアンケート
----------------------------------------------*/

/*見出し*/
#main .reserch_list{
    margin:0 0 13px;
}
#main .reserch_list .title{
  border-top:2px solid #ff5555;
  border-bottom:1px solid #cccccc;
  padding:10px 8px;
  overflow:hidden;
}
#main .reserch_list .title h2{
  color:#4d4d4d;
  float:left;
  margin:2px 0 0;
}

/*表示・非常時ボタン*/
#main .reserch_list .display_btn,
#main .reserch_list .hide_btn{
    float:right;
}
#main .reserch_list .display_btn form input{
    border:#4d4d4d 1px solid;
    padding:4px 20px;
    border-radius:4px;
    background:#fff;
}
#main .reserch_list .hide_btn form input{
    border:#4d4d4d 1px solid;
    padding:4px 20px;
    border-radius:4px;
    color:#fff;
    background:#6F6F6F;
}
#main .reserch_list .hide_btn form input:hover{
    color:#000;
    background:#fff;
    cursor:pointer;
}
#main .reserch_list .display_btn form input:hover{
    color:#fff;
    background:#6F6F6F;
    cursor:pointer;
}

/*アンケートリスト*/
#main .reserch_list ul.reco li:nth-child(n+21){
    display:none;
}
#main .reserch_list ul.reco li{
    border-bottom:#c5c5c5 dotted 1px;
    overflow:hidden;
}
#main .reserch_list ul.reco li ins{
    display: block !important;
    padding: 5px 0;
    margin: 0 auto;
}
#main .reserch_list ul.reco li:nth-of-type(5n){
    text-align: center;
    padding: 5px 0;
}
#main .reserch_list ul.reco li:nth-last-child(2){
    border-bottom:#c5c5c5 solid 1px;
}
#main .reserch_list ul li a{
    overflow:hidden;
    padding:4px 0;
    display:table;
    vertical-align:middle;
}
#main .reserch_list ul li p{
    float:left;
    text-align:center;
}
#main .reserch_list ul li .date{
    width:75px;
    padding:2px 0;
    margin:7px;
    font-size:11px;
}
#main .reserch_list ul li h3{
    float:left;
    width:260px;
    display:table-cell;
    vertical-align:middle;
    margin:9px 7px 0 0;
    font-size:13px;
    font-weight:bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#main .reserch_list ul li .number{
    width:120px;
    margin:7px 0 0;
    border-right:#cccccc solid 1px;
    border-left:#cccccc solid 1px;
}
#main .reserch_list ul li .pt{
    width:100px;
    font-size:14px;
    text-align:left;
    padding:0 0 0 20px;
    margin:5px 5px 0;
}
#main .reserch_list ul li .btn{
    background:#3dba8f;
    color:#fff;
    font-weight:bold;
    font-size:12px;
    width:55px;
    margin:4px 4px 0 4px;
    padding:4px 6px;
    display:block;
    border-radius:30px;
}
#main .reserch_list ul li a:hover .btn{
    text-decoration:none;
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
    background:#6ed5b2;
}

/*もっと見るボタン*/
#main .reserch_list ul li.more{
    border:none;
    display:none;
}
#main .reserch_list ul li.more button{
  width:300px;
  display:block;
  margin:10px auto;
  padding: 15px;
  border: none;
  border-radius: 2px;
  background: #3dba8f;
  box-shadow: 1px 1px 2px #a8a8a8;
  text-align:	center;
  font-size:16px;
  color: #fff;
}
#main .reserch_list ul li.more button:hover{
   transition: .2s linear;
   -webkit-transition: .2s linear;
   -moz-transition: .2s linear;
   -o-transition: .2s linear;
   -ms-transition: .2s linear;
   background: #059262;
   cursor:pointer;
}

/*アンケートリスト・説明*/
#main .reserch_list .explain{
    overflow:hidden;
    border-bottom:#c5c5c5 solid 1px;
}
#main .reserch_list .explain li{
    border:none;
    float:left;
    text-align:center;
    margin:2px 0;
}
#main .reserch_list .explain li:last-child{
    border:none;
}
#main .reserch_list .explain li:nth-child(1){
    width:91px;
}
#main .reserch_list .explain li:nth-child(2){
    width:267px;
}
#main .reserch_list .explain li:nth-child(3){
    width:122px;
}
#main .reserch_list .explain li:nth-child(4){
    width:130px;
}
#main .reserch_list .explain li:nth-child(5){
    width:75px;
}

/*未配信時*/
#main .nothing{
    padding:40px 0;
    font-size:16px;
    text-align:center;
}
#main .nothing .caution{
    margin:10px 0 0;
    color:#ff5555;
}
#main .nothing a{
    text-decoration:underline;
    color:#04c;
}
#main .nothing a:hover{
    background:none;
    color:#6cf;
}

/*終了済、回答済*/
#main .reserch_list ul .finish,
#main .reserch_list ul .already{
    background:#efefef;
    padding:0;
}
#main .reserch_list ul li.finish .date,
#main .reserch_list ul li.already .date{
    background: #989898;
    color:#fff;
    border: 1px solid #989898;
}
#main .reserch_list ul li.finish h3,
#main .reserch_list ul li.finish p,
#main .reserch_list ul li.already h3,
#main .reserch_list ul li.already p{
    color:#989898;
}
#main .reserch_list ul li.finish .btn{
    color:#fff;
    background:#989898;
}
#main .reserch_list ul li.already .btn{
    color:#989898;
    background:#fff;
}

/*注意事項*/
#main .attention{
    border-top:2px solid #4d4d4d;
    border-bottom:1px solid #cccccc;
    border-left:1px solid #cccccc;
    border-right:1px solid #cccccc;
    padding:10px;
    background:#f1f1f1;
}
#main .attention ul{
    margin:10px 0 0;
    overflow:hidden;
}
#main .attention ul li a{
    color:#4d4d4d;
    width:155px;
    float:left;
    margin:0 12px 0 0;
    padding:7px 0;
    text-align:center;
    background:#fff;
    border-radius:2px;
    border:#c5c5c5 solid 1px;
}
#main .attention ul li:last-child a{
    margin:0;
}
#main .attention ul li a:hover{
    color:#fff;
    background:#6F6F6F;
}

/*----------------------------------------------
未ログイン時
----------------------------------------------*/

#main .nologin{
    background:url(../img/10/research/bg_nologin.gif) 0 0 no-repeat;
    margin:0 0 10px;
}
#main .nologin ul{
    text-align:center;
    overflow:hidden;
    font-weight:bold;
    font-size:20px;
    margin:10px 0;
    padding:0 20px 20px;
}

#main .nologin li:first-child a{
    float:left;
    display:block;
    color:#fff;
    background:#3dba8f;
    width:380px;
    padding:10px 0;
    margin:0 30px 0 0;
    border-radius:5px;
    box-shadow:0px 5px 0px 0px #368f70;
}
#main .nologin li:first-child a:hover{
    background:#6ed5b2;
    box-shadow:0px 5px 0px 0px #3dba8f;
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
}
#main .nologin li:last-child a{
    float:left;
    display:block;
    color:#fff;
    background:#F83D6E;
    width:240px;
    padding:10px 0;
    border-radius:5px;
    box-shadow:0px 5px 0px 0px #CB1B4C;
}
#main .nologin li:last-child a:hover{
    background:#FF779D;
    box-shadow:0px 5px 0px 0px #F83D6E;
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;
}

/*===============================================
広告
===============================================*/
.ad {
    margin: 10px 0 0;
    text-align: center;
}
.ad_research {
    padding: 5px 0 10px;
    border: 1px solid #ccc;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 2px;
}
.ad_research p {
    margin-bottom: 3px;
    font-size: 85%;
}
#main .impact{
    margin:20px 0;
    text-align:center;
}

/* ブランドバナー */
#sub #adbanner {
    width: 250px;
    text-align:center;
    margin: 0 0 15px;
    overflow: hidden;
}
#sub #adbanner .to-dtl a{
    background: url(/img/10/present/icon-list.gif) no-repeat 0 -290px;
    padding:0 0 0 10px;
}
#sub #adbanner .banner{
    width: 250px;
    margin: 0 auto 5px;
    padding: 0;
    text-align: center;
}
#sub #adbanner .banner img{
    max-width: 250px;
    height: auto;
}
#sub #adbanner a:hover{
    opacity:0.6;
}
#sub #adbanner .point{
    color:#ff5555;
    font-size:13px;
    display:inline-block;
    font-weight:bold;
    background: url(/img/icon/ico-pt.gif) center left no-repeat;
    padding:0 0 0 15px;
    margin:0 0 0 5px;
}
#sub #adbanner a{
    display:inline-block;
}
#wrapper #pv-ad728{
    background-color: #F1F1F1;
    clear: both;
    display: block;
    margin: 3px 0 5px;
    padding: 15px 0;
    text-align: center;
    height:90px;
}