@charset "utf-8";
/* CSS Document */



/*****************************************

common

*****************************************/

body{
color:#333333;
}


#cont h1 {
color: #666666;
font-size: 10px;
font-weight: normal;
margin-bottom: 10px;
margin-left: 13px;
margin-top: 3px;
}

#navBox ul{
margin: 0 97px 30px;
}

#navBox ul li{
background-image:url("../img/kataru/line_nav.gif");
background-repeat:no-repeat;
background-position:right center;
list-style-type:none;
float:left;
font-size:14px;
width:115px;
margin-right:25px;
}

#navBox ul li.k_wri{
background-image:none;
margin-right:0;
}

#navBox ul li a{
background-repeat:no-repeat;
background-position:left center;
display:inline-block;
height:20px;
/*width:100%;*/
padding-left:30px;
padding-top:3px;
}

#navBox ul li a:hover{
background-color:#EAEAEA;
opacity:1;
-ms-filter: "alpha( opacity=100 )";
filter: alpha( opacity=100 );
padding-right:2px;
}

#navBox ul li.k_the a{
background-image:url("../img/kataru/icon_theme.gif");
}

#navBox ul li.k_lev a{
background-image:url("../img/kataru/icon_level.gif");
}

#navBox ul li.k_tar a{
background-image:url("../img/kataru/icon_target.gif");
}

#navBox ul li.k_wri a{
background-image:url("../img/kataru/icon_writer.gif");
}


td{
font-weight:bold;
}


#k_themeBox td.dataNull,
#k_targetBox td.dataNull{
background-image:none;
padding:0 0 0 35px;
}

#kataru_container a{
font-weight:bold;
}

#kataru_container a:hover{
text-decoration:underline;
opacity:0.7;
-ms-filter: "alpha( opacity=70 )";
filter: alpha( opacity=70 );
}

/*****************************************

テーマでみる

*****************************************/


#k_themeBox{
background-image:url("../img/kataru/theme_box_top.gif");
background-repeat:no-repeat;
background-position:20px top;
border:1px solid #A79170;
padding:20px 0;
margin-bottom:40px;
}

.ie #k_themeBox{
padding-top:100px;
}

#k_themeBox table{
border-collapse:collapse;
width:100%;
margin-top:75px;
}

#k_themeBox table td{
background-image:url("../img/kataru/arrow_theme.jpg");
background-repeat:no-repeat;
background-position:35px center;
border-bottom:1px dotted #A79170;
font-size:14px;
padding:7px 0 7px 55px;
width:50%;
}


/*****************************************

階層別でみる

*****************************************/

#k_levelBox{
background-image:url("../img/kataru/level_box_top.gif");
background-repeat:no-repeat;
background-position:20px top;
border:1px solid #96B6E3;
padding:20px 0;
margin-bottom:40px;
}

.k_level_bg{
position:relative;
margin-top:90px;
}

/** リンク **********************************/
.k_level_list{
position:absolute;
left:28px;
top:0;
}

/** 階層別 **********************************/
.kan{
top:135px;
}

.chu{
top:264px;
}

.newcom{
top:393px;
}

/** タグの色 **********************************/
.k_level_list .k_tag{
background-color:#96B6E3;
text-align:center;
width:170px;
font-size:14px;
font-weight:bold;
padding:5px;
margin-bottom:10px;
}

.kan .k_tag{
background-color:#96BFE5;
}

.chu .k_tag{
background-color:#AACAE7;
}

.newcom .k_tag{
background-color:#D6E0EA;
}

/** リスト **********************************/
.k_level_list ul{
font-size:14px;
font-weight:bold;
margin-left:20px;
}

.k_level_list ul li{
list-style-image:url("../img/kataru/arrow_level.jpg");
list-style-position:inside;
margin-bottom:3px;
}

.chrome .k_level_list ul li{
margin-bottom:5px;
line-height:100%;
}



.ie .k_level_list ul li{
list-style-type:none;
list-style-image:none;
background-image:url("../img/kataru/arrow_level.jpg");
background-repeat:no-repeat;
background-position:left top;
padding-left:0px;
margin-bottom:5px;
}

.k_level_list ul.fl{
width:380px;
}

.ie .k_level_list ul.fr{
margin-left:-314px;
}


/*****************************************

対象者でみる

*****************************************/
#k_targetBox{
background-image:url("../img/kataru/target_box_top.gif");
background-repeat:no-repeat;
background-position:20px top;
border:1px solid #737373;
padding:20px 0;
margin-bottom:40px;
}


.ie #k_targetBox{
padding-top:100px;
}

#k_targetBox table{
border-collapse:collapse;
width:100%;
margin-top:110px;
table-layout: fixed;
}

#k_targetBox table td{
background-image:url("../img/kataru/arrow_target.jpg");
background-repeat:no-repeat;
background-position:35px center;
border-bottom:1px dotted #737373;
font-size:14px;
padding:7px 0 7px 55px;
width:50%;
}

#k_targetBox table td.k_target{
background-image:none;
padding:2px 0 2px 35px;
}


#k_targetBox table td.k_target span{
background-color:#4b4b4b;
color:#ffffff;
padding:5px 20px;
display:inline-block;
width:170px;
font-weight:normal;
}



/*****************************************

制作者でみる

*****************************************/

#k_writerBox{
background-image:url("../img/kataru/writer_box_top.gif");
background-repeat:no-repeat;
background-position:20px top;
border:1px solid #8E8012;
padding:20px 0;
margin-bottom:40px;
}

#k_writerBox p{
font-size:14px;
margin-bottom:20px;
line-height:150%;
}

#k_writerBox .plofileBox{
margin:110px 28px 0;
}


#k_writerBox .plofileBox .writer_r{
width:320px;
}

#k_writerBox .plofileBox .writer_l .fl,
#k_writerBox .plofileBox .writer_r .fl{
width:95px;
font-weight:bold;
}

#k_writerBox .plofileBox .writer_l .fr,
#k_writerBox .plofileBox .writer_r .fr{
width:225px;
}

#k_writerBox ul{
font-size:14px;
}

#k_writerBox ul li{
list-style-image:url("../img/kataru/arrow_writer.jpg");
list-style-position:inside;
margin-bottom:15px;
text-indent:-18px;
padding-left:18px;
line-height:1.3;
}


/*===============================

    responsive

================================*/
@media screen and (max-width:768px){
div#footer { margin: 0; }

#navBox ul { margin : 0 0 30px; }

#k_themeBox,
#k_levelBox,
#k_targetBox,
#k_writerBox {
  background: none;
  position: relative;
}

/* テーマで見る */
#k_themeBox::before {
  content:"テーマで見る";
  color: #A79170;
  font-family: "游ゴシック";
  font-size: 25px;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 25px;
  left: 10px;
}

#k_themeBox table td {
  background: none;
  line-height: 1.3;
  padding: 7px 10px;
}

/* 階層別で見る */
#k_levelBox::before {
  content:"階層別で見る";
  color: #96B6E3;
  font-family: "游ゴシック";
  font-size: 25px;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 25px;
  left: 10px;
}

.k_level_bg { margin-top: 75px; }

#k_levelBox { overflow: hidden; }
.k_level_list { position: static; }
.k_level_bg img[src$=".jpg"] { display: none; }
.k_level_list ul.fl,
.k_level_list ul.fr {
  float: none;
  width: 100%;
}

.k_level_list ul + ul { margin-top: 10px; }

.k_level_list ul li + li,
.k_level_list ul + ul li +li { margin-top: 10px; }

.k_level_list .k_tag {
  margin-top: 30px;
  text-align: left;
  width: auto;
}

/* 対象者別で見る */
#k_targetBox::before {
  content:"対象者で見る";
  color: #737373;
  font-family: "游ゴシック";
  font-size: 25px;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 25px;
  left: 10px;
}

#k_targetBox table { margin-top: 75px; }

#k_targetBox table td {
  background: none;
  border-bottom: none;
  line-height: 1.3;
  padding: 7px 10px;
  width: auto;
}

#k_targetBox table td.k_target { padding: 0; }

#k_targetBox table td.k_target span {
padding: 5px;
width: 100%;
}

/* 制作者で見る */
#k_writerBox::before {
  content:"制作者で見る";
  color: #8E8012;
  font-family: "游ゴシック";
  font-size: 25px;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 25px;
  left: 10px;
}

#k_writerBox .plofileBox { margin: 75px 28px 0; }

#k_writerBox .plofileBox .writer_l {
  border: none;
  width: auto;
}

}