@charset "utf-8";
/*=====================================================
((CSS INDEX))
layout common
headerArea
contentsArea
right side
footerArea
CTA
pageTop
icon
=====================================================*/	
/*-----------------------------------------------
layout common
------------------------------------------------*/
#headerArea {
text-align:left;
margin-left:auto;
margin-right:auto;
width:100%;
padding:0px;
min-height:100%;
}
#contentsArea,
#footerArea {
text-align:left;
margin-left:auto;
margin-right:auto;
width:1020px;
padding:0;
min-height:100%;
}

@media screen and (max-width:767px) {
#headerArea{
width:100%;
}
#contentsArea,
#footerArea{
width:100%;
padding:0 10px;
}
}

/*-----------------------------------------------
headerArea
------------------------------------------------*/
/*---header------------ */
#headerArea{
padding-top:4px;
min-height:5em;
height:70px;
}
#headerCatch{
margin-left:auto;
margin-right:auto;
width:1020px;
font-size:10px;
font-family:MS PGothic;
margin-top:4px;
margin-bottom:2px;
}
#headerArea .header{
margin-left:auto;
margin-right:auto;
width:1020px;
padding-top:4px;
}
#headerArea #headerLeft{
float:left;
width:600px;
}
#headerArea #headerRight{
float:right;
text-align:right;
}
#headerArea #headerLogo{
float:left;
width:50%;
margin-top:6px;
margin-bottom:6px;
}

#headerRight #search .searchTxt{
padding:6px 6px 6px 26px;
margin-top:0px;
background:url(/database/common/image/lightbox_magnify.png) no-repeat 4px 4px;
border:1px #999 solid;
width:242px;
}
#headerRight #search .searchTxt:placeholder-shown {
color:#999;
}
#headerRight #search .searchTxt::-webkit-input-placeholder { /* Google Chrome, Safari, Opera 15+, Android, iOS */
color:#999;
}
#headerRight #search .searchTxt:-moz-placeholder { /* Firefox 18- */
color:#999;
opacity:1;
}
#headerRight #search .searchTxt::-moz-placeholder { /* Firefox 19+ */
color:#999;
opacity:1;
}
#headerRight #search .searchTxt:-ms-input-placeholder { /* IE 10+ */
color:#999;
}

.fixed .fixheader {
position:fixed;
top:0px;
width:100%;
background:#fff;
border-bottom:1px solid #ccc;
z-index:999;
}
.fixed #headerCatch{
transition:opacity .4s ease 0s;
opacity:0;
}

@media screen and (min-width:768px) {
#headerArea #headerCVbtn {
display:none;
}
}

@media screen and (max-width:767px) {
#headerArea {
min-height:100%;
height:auto;
border-bottom:1px solid #ccc;
}
#headerCatch,
#headerArea .header{
float:none;
width: auto;
max-width: 100%;
padding-top:0px;
padding-left:10px;
}
#headerArea #headerLeft{
width:80%;
}
#headerArea #headerRight{
width:20%;
}
#headerArea #headerLogo {
width:40%;
min-width:60px;
margin-top:0px;
margin-bottom:0px;
padding-top:0px;
}
#headerArea #headerCVbtn {
margin:0;
padding:0;
}
#headerArea #headerCVbtn a {
display:inline-block;
margin-top:6px;
background-color:#333;
border-radius:4px;
padding:12px 12px;
color:#fff;
font-size:12px;
text-decoration:none;
}
#headerArea #headerCVbtn a span {
background:url('/common/image/ico_mail.png') 0 1.6px no-repeat;
background-size:20px auto;
padding-left:24px;
}
#headerArea #headerCVbtn a:hover {
background-color:rgba(153,0,0,0.9);
}

/* search */
#headerRight .header {
position:relative;
}
#headerRight #search:before,
#headerRight #search .searchTxt {
position:absolute;
top:31px;
right:10px;
width:30px;
height:38px;
margin:0;
}
.fixed #headerRight #search:before,
.fixed #headerRight #search .searchTxt {
top:6px;
}
#headerRight #search .searchTxt {
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
-webkit-transition:width 0.3s ease-in;
-moz-transition:width 0.3s ease-in;
-o-transition:width 0.3s ease-in;
transition:width 0.3s ease-in;
background:#fff url(/database/common/image/lightbox_magnify.png) no-repeat 50% 8px;

}
#headerRight #search .searchTxt::placeholder,
#headerRight #search .searchTxt:placeholder-shown,
#headerRight #search .searchTxt::-webkit-input-placeholder,
#headerRight #search .searchTxt:-moz-placeholder,
#headerRight #search .searchTxt::-moz-placeholder,
#headerRight #search .searchTxt:-ms-input-placeholder {
color:#fff;
opacity:0;
}
#headerRight #search .searchTxt:focus {
width:94%;
cursor:text;
background-position:2% 8px;
padding-left:36px;
}
}
/*@media screen and (max-width:320px) {
#headerRight #search:before,
#headerRight #search .searchTxt {
top:46px;
}
}*/

/*---globalNavi---------- */
#gNavi{
clear:both;
background:url(/common/image/bg_body.gif) repeat-x;
height:40px;
padding:0 10px;
}
#gNavi ul{
width:1020px;
margin:0 auto;
padding:0;
}
#gNavi li{
display:inline;
}
#gNavi li a{
width:145px;
text-decoration:none;
height:40px;
display:block;
float:left;
font-family:'游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-size:13px;
font-weight:bold;
color:#7c7c7c;
border-right:1px solid #ccc;
border-top:3px solid transparent;
padding-top:10px;
}
@-moz-document url-prefix() { /* for Firefox */
  #gNavi li a{
    font-weight:normal;
  }
}
@media screen and (-webkit-min-device-pixel-ratio:0) { /* for Safari */
  ::i-block-chrome, #gNavi li a{
    font-weight:normal;
  }
}
*:first-child+html #gNavi li a { /* for ie7 */
height:27px;
}
#gNavi li#gnLineup a{
width:148px;
border-left:1px solid #ccc;
}
#gNavi li a:hover{
color:#c33;
border-top:3px solid #c33;
}
#gNavi #gnRelease a:hover,
.release #gNavi #gnRelease a,
.database #gNavi #gnRelease a,
#categoryTop #gNavi #gnRelease a,
#categoryData #gNavi #gnRelease a {
border-top:3px solid #c33;
}

@media screen and (min-width:768px) {
#gNavi{
min-width:1020px;
}
}
@media screen and (max-width:767px) {
#gNavi{
display:none;
}
}


/*-----------------------------------------------
contentsArea - main
------------------------------------------------*/
#contentsArea{
margin-bottom:45px;
}
/*---breadcrumb---------- */
#breadCrumb{
margin:16px 0 16px;
font-size:92%;
}
/*---contentsBlock----------- */
#contentsBlock{
float:left;
width:1020px;
margin:10px 0 40px;
background-image:none;
}
/*---contentsLeft--------- */
#contentsLeft{
float:left;
width:728px;
}
/*---contentsRight--------- */
#contentsRight{
float:right;
height:100%;
height:auto !important;
width:242px;
}

@media screen and (max-width:767px) {
#contentsBlock {
float:none;
width:100%;
margin:20px auto;
}
#contentsLeft{
float:none;
width:100%;
margin-bottom:40px;
}
#contentsRight{
float:none;
width:100%;
}
#breadCrumb {
line-height:1.6;
margin-bottom:0;
background-color:#f7f7f7;
padding:6px 4px;
color:#7c7c7c;
}
#breadCrumb a {
color:#666;
}
}

/*-----------------------------------------------
contentsArea - right side
------------------------------------------------*/
/*---localNavi--------- */
#contentsRight #lNavi a{
display:block;
text-decoration:none;
}
/*lNaviTop*/
#contentsRight #lNavi h2{
margin:0;
padding:0;
border:none;
border-bottom:1px solid #d9d9d9;
font-weight:normal;
height:240%;
line-height:240%;
}
#contentsRight #lNavi h2 a{
padding-left:6px;
border-left:4px solid #c99;
background-color:#ddd;
color:#777;
}
#contentsRight #lNavi h2 a:hover{
color:#d50303;
}
/*lNaviLev*/
#contentsRight #lNavi h3,
#contentsRight #lNavi li{
height:300%;
line-height:300%;
}
#contentsRight #lNavi h3{
margin:0;
padding:0;
border:none;
padding-left:6px;
border-left:4px solid #e0e0e0;
border-bottom:1px dotted #e0e0e0;
background:#f7f7f7;
font-size:90%;
font-weight:normal;
}
/*lNaviLev1 li*/
#contentsRight #lNavi .lNaviLev1{
border-left:1px solid #e0e0e0;
}
#contentsRight #lNavi .lNaviLev1 li{
border-bottom:1px dotted #e0e0e0;
font-size:100%;
vertical-align:middle;
padding:0;
}
#contentsRight #lNavi .lNaviLev1 li a {
color:#666;
border-left:4px solid #fff;
padding-left:6px;
}
/*現在地・hover*/
#contentsRight #lNavi h2 a:hover,
#contentsRight #lNavi li a:hover,
#contentsRight #lNavi li.current a{
color:#c33;
border-left:4px solid #c33;
}

@media screen and (max-width:767px) {
#contentsRight #lNavi li,
#contentsRight #lNavi h2{
height:380%;
line-height:380%;
}
#contentsRight #lNavi h3,
#contentsRight #lNavi h3 + .lNaviLev1 {
display:none;
}
}

/*---inquiry--------- */
.bnr_inquiry {
border:none;
margin-bottom:20px;
}
.bnr_inquiry a {
display:inline-block;
/*position:relative;*/
width:100%;
height:136px;
color:#fff;
border-radius:4px;
text-align:center;
vertical-align:middle;
overflow:hidden;
text-decoration:none;
box-shadow:inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
font-weight:bold;
/*background-color:#cc3333;
border:solid 2px #cc0000;*/
background-color:#04338D;
border:solid 2px #000066;
-moz-transition:all 0.2s ease-in;
-webkit-transition:all 0.2s ease-in;
-o-transition:all 0.2s ease-in;
-ms-transition:all 0.2s ease-in;
transition:all 0.2s ease-in;
}
.bnr_inquiry a:hover {
/*background-color:#cc0000;
border-color:#aa0000;*/
opacity:0.9;
box-shadow:inset 0 2px 0 rgba(255,255,255,0.4), inset 0 -2px 0 rgba(0, 0, 0, 0.2);
}
.bnr_inquiry:active{
/*border-color:#aa0000;*/
box-shadow:0 0 3px rgba(0, 0, 0, 0.6);
}
.bnr_inquiry .link2 {
padding:60px 0 0;
font-size:140%;
font-weight:normal;
background:url(/common/image/ico_mail.png) center 20px no-repeat;
-webkit-background-size:18% 24%;
-moz-background-size:18% 24%;
-ms-background-size:18% 24%;
-o-background-size:18% 24%;
background-size:18% 24%;
}

@media screen and (max-width:767px) {
.bnr_inquiry {
width:100%;
}
.bnr_inquiry .link2 {
-webkit-background-size:40px 26px;
-moz-background-size:40px 26px;
-ms-background-size:40px 26px;
-o-background-size:40px 26px;
background-size:40px 26px;
}
}

/*-----banner-----*/
#contentsArea #rightBnr,
#contentsArea #privacy{
margin-top:20px;
}
#contentsArea #privacy{
height:80px;
}
#contentsArea #privacy .img{
float:left;
margin:0 10px 5px 0;
}
#contentsArea #rightBnr ul{
margin-bottom:15px;
}
#contentsArea #rightBnr li{
margin-bottom:10px;
}
#contentsArea #rightBnr li:last-of-type{
margin-bottom:0px;
}
#contentsArea #topBnr{
margin-bottom:25px;
}
@media screen and (max-width:767px) {
#contentsArea #privacy{
height:auto;
}
#contentsArea #rightBnr li{
text-align:center;
}
}

/*-----------------------------------------------
footerArea	
------------------------------------------------*/
/*------pagetop------ */
#pagetop {
  z-index:3;
}
#pagetop a {
  cursor:pointer;
}
/*@media print, screen and (min-width:768px) {*/
  #pagetop {
    position:fixed;
    bottom:555px;
    right: 1%;
    margin:0;
    display:none;
  }
/*}*/
#pagetop a img {
opacity:0.6;
}
#pagetop a:hover img {
opacity:0.9;
}
@media print, screen and (min-width:1250px) {
  #pagetop {
    right: 10%;
  }
}
@media screen and (max-width:767px) {
  #pagetop {
    left:89%;
    margin:0;
  }
/*  #pagetop {
    padding:0 0 20px;
  }
  #pagetop p {
    text-align:center;
  }
  #pagetop p img {
    width:40px;
    height:40px;
  }*/
}

/*------footerArea------ */
footer {
border-top:1px solid #ccc;
padding-top:10px;
padding-bottom:10px;
}
#footerArea{
padding:0 10px;
margin-top:24px;
font-size:84%;
}
#footerMenu{
margin-top:-21px;
}
* html #footerMenu{/*for ie6*/
}
#footerMenu ul li,
#footerCopy ul li{
display:inline;
}
#footerMenu ul#footerMenu1,
#footerMenu ul#footerMenu1 a{
color:#8c8c8c;
text-align:right;
}
#footerCopy,
#footerCopy a,
#footerMenu ul#footerMenu2,
#footerMenu ul#footerMenu2 a{
color:#999;
}
#footerMenu ul#footerMenu1 a:hover,
#footerMenu ul#footerMenu2 a:hover,
#footerCopy a:hover{
color:#c90000;
}
#footerCopy img{
margin:-5px 5px 0 0;
float:left;
}
* html #footerCopy img{/*for ie6*/
margin:-1px 5px 0 0;
}
#footerCopy #copy{
float:right;
}
#footerComment{
color:#999;
margin-top:20px;
margin-bottom:5px;
}

@media screen and (min-width:768px) {
footer{
min-width:1020px;
}
}

/*-----------------------------------------------
CTA
------------------------------------------------*/
#contentsBlock .contsBnr {
margin:0 auto;
background:#eee;
padding:20px 0 30px;
background-size:cover;
text-align:center;
}
#contentsBlock .contsBnr.footer {
margin-top:70px;
}
#contentsBlock .cta {
width:64%;
margin:10px auto 0px;
}
#contentsBlock .cta a {
display:inline-block;
text-decoration:none;
width:100%;
padding:16px 0;
background:#04338d;
border:2px solid #eee;
-webkit-appearance:none;
-moz-transition:all 0.4s ease-in;
-webkit-transition:all 0.4s ease-in;
-o-transition:all 0.4s ease-in;
-ms-transition:all 0.4s ease-in;
transition:all 0.4s ease-in;
}
#contentsBlock .cta.nps a {
background:#0066CC;
}
#categoryData #contentsBlock #entry_body .cta a {
text-decoration:none;
}
#contentsBlock .cta a:hover {
border-color:#04338d;
}
#contentsBlock .cta.nps a:hover {
border-color:#0066CC;
}
#contentsBlock .cta a span {
background:url(/common/image/ico_ftarrow.png) 0 0 no-repeat;
padding-left:35px;
font-size:20px;
letter-spacing:2px;
color:#fff;
-webkit-appearance:none;
-moz-transition:background 0.3s ease-in;
-webkit-transition:background 0.3s ease-in;
-o-transition:background 0.3s ease-in;
-ms-transition:background 0.3s ease-in;
transition:background 0.3s ease-in;
}
#contentsBlock .cta a:hover span {
background:url(/common/image/ico_ftarrow_o.png) 0 0 no-repeat;
color:#fff;
}

@media screen and (max-width:767px) {
#contentsBlock .contsBnr.middle {
display:none;
}
#contentsBlock .contsBnr {
padding: 20px 0;
}
#contentsBlock .cta {
width: 90%;
margin: 10px auto 10px;
}
#contentsBlock .contsBnr.footer {
display:none;
}
}

/*-----------------------------------------------
pagination
------------------------------------------------*/
.pagination {
margin:3.236em 0;
text-align:center;
}
.pagination ul {
display:block;
padding:0;
}
.pagination li {
display:inline-block;
}
.pagination li a {
padding:0 10px;
text-decoration:none;
}
.pagination li a[rel="prev"]:before {
content:'\00AB';
margin-right:0.3em;
}
.pagination li a[rel="next"]:after {
content:'\00BB';
margin-left:0.3em;
}

/*----------------------------------------------------
icon
----------------------------------------------------*/
.icon {
display:inline-block;
margin-left:3px;
width:64px;
height:12px;
line-height:12px;
padding-top:1px;
box-sizing:content-box;
border:1px solid #bbb;
background:#fff;
color:#fff;
font-size:11px;
vertical-align:middle;
text-align:center;
overflow:hidden;
font-weight:normal;
}
.icon.eat {
border-color:#fd9e05;
background:#fd9e05;
}
.icon.reside {
border-color:#8dc632;
background:#8dc632;
}
.icon.study {
border-color:#25a821;
background:#25a821;
}
.icon.live {
border-color:#34aba7;
background:#34aba7;
}
.icon.alive {
border-color:#ec2617;
background:#ec2617;
}
.icon.work {
border-color:#0061e6;
background:#0061e6;
}
.icon.spend {
border-color:#6424d2;
background:#6424d2;
}
.icon.play {
border-color:#aa3592;
background:#aa3592;
}
.icon.sicken {
border-color:#c89a32;
background:#c89a32;
}
.icon.concern {
border-color:#ef49b8;
background:#ef49b8;
}
.icon.popularity {
border-color:#ab651f;
background:#ab651f;
}
.icon.communicate {
border-color:#3c98d9;
background:#3c98d9;
}
.icon.protect {
border-color:#7c3300;
background:#7c3300;
}
.icon.jishu {
color:#b87d1b;
}
.icon.kyodo {
color:#1e6d02;
}
.icon.trend {
color:#053ca4;
}
.icon.download {
border-color:#CC3333;
background:#CC3333;
width:auto;
padding-left:6px;
padding-right:6px;
}

/*----------------------------------------------------
other
----------------------------------------------------*/
.nps_footer {
margin:80px 0 60px;
}
.nps_footer p {
margin-bottom:30px;
}

/*----------------------------------------------------
fixed button
----------------------------------------------------*/
@media screen and (min-width:641px) {
#fixedBtn {
position:fixed;
right:0;
top:160px;
overflow:hidden;
}
#fixedBtn .button {
background: #04338D;
margin: 0;
width:2em;
height:180px;
padding-right:10px;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
#fixedBtn .button a{
color:#fff;
text-decoration:none;
letter-spacing: 1px;
}
#fixedBtn .button a:hover{
opacity:0.9;
}
}
