@charset "UTF-8";
/* トップページ専用CSS */


/*--------------------------------------------------------------------
0. メインラッパー
--------------------------------------------------------------------*/
#topmain_wrapper{
margin:0 auto;
width:980px;
}

@media screen and (max-width: 360px) {
  div#topmain_wrapper{
  width:100%;
  }
}

/*--------------------------------------------------------------------
1. コンテンツヘッダー
--------------------------------------------------------------------*/
/* コンテンツヘッダー */
#contents_header{
position:relative;
margin-bottom:30px;
padding-top:45px;
}

@media screen and (max-width: 360px) {
  #contents_header{
  margin-bottom:10px;
  padding-top:0;
  }
}

/* h1（ページタイトル） */
.xpacmskit h1.hide{
left:-9999px;
position:absolute;
height:0;
line-height:0;
}

/* メインスライダー
---------------------------------------------*/
#mainslider_wrapper{}

#mainslider_frame{
position:relative;
width:640px;
height:380px;
background-color:#5586cc;
}

@media screen and (max-width: 360px) {
  #mainslider_wrapper{
  margin-bottom:20px;
  }

  #mainslider_frame{
  width:100%;
  height:auto;
  }
}

#mainslider{}

#mainslider_item{
height:380px;
max-height:380px;
overflow:hidden;
}

@media screen and (max-width: 360px) {
  #mainslider_item{
  height:213px;
  max-height:213px;
  min-height:213px;
  }
}


#mainslider_item li{
float:left;
}

#mainslider_item li img{
width:100%;
height:380px;
}

@media screen and (max-width: 360px) {
  #mainslider_item li img{
  height:213px;
  }
}


/* コントローラー */
#prev{
position:absolute;
top:50%;
left:10px;
width:18px;
height:31px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
background-image:url(./common/img/btn_ctrl_prev.png);
background-repeat:no-repeat;
background-position:left top;
cursor:pointer;
}

#next{
position:absolute;
top:50%;
right:10px;
width:18px;
height:31px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
background-image:url(./common/img/btn_ctrl_next.png);
background-repeat:no-repeat;
background-position:left top;
cursor:pointer;
}

/* Media Queries */
/* less than 360: スマホ用 */
@media screen and (max-width: 360px) {
  #prev{
  top:40%;
  left:0px;
  }

  #next{
  top:40%;
  right:0px;
  }
}

/* ページャー */
#pager_wrapper{
position:absolute;
bottom:0;
bottom:-30px;
width:100%;

*overflow:hidden; /* ie7 */
}

#pager{
position:relative;
padding:10px 0;
text-align:center;

*left:50%; /* ie7 */
*float:left; /* ie7 */
*height:10px; /* ie7 */
}

#pager a{
position:relative;
*left:-50%; /* ie7 */
display:inline-block;
*display:block; /* ie7 */
*float:left; /* ie7 */
margin:0 4px;
width:10px;
height:10px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
background-color:#3c75c0;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
behavior:url(/common/behavior/PIE.htc);

*zoom:1; /* ie7 */
}

#pager a.selected{
background-color:#ffffff;
background-color:#85b8fa;
}

/* 財団からのお知らせ
---------------------------------------------*/
#top_info_fdn{
position:absolute;
top:45px;
right:0px;
width:340px;
height:380px;
background-color:#5586cc;
overflow:hidden;
}

#ttl_top_info_fdn{
position:relative;
}

@media screen and (max-width: 360px) {
  #top_info_fdn{
  position:relative;
  top:0;
  right:0;
  width:100%;
  height:auto;
  background-color:#ffffff;
  }

  #ttl_top_info_fdn{
  }
}

#ttl_top_info_fdn h2{
height:50px;
font-size:115%;
line-height:50px;
text-align:center;
color:#ffffff;
background-color:#5586cc;
}

@media screen and (max-width: 360px) {
  #ttl_top_info_fdn h2{
  padding-left:1em;
  height:46px;
  line-height:46px;
  text-align:left;
  }
}

/* お知らせリスト */
#top_info_fdn_body{
padding:0 10px;
height:330px;
}

#top_info_fdn_body dl{
height:320px;
background-color:#ffffff;
overflow:auto;
}

#top_info_fdn_body dl dt{
padding:16px 20px 0;
font-size:86%;
border-left:6px solid #5286cc;
}

#top_info_fdn_body dl dt > span{
position:relative;
top:-2px;
margin-left:0.5em;
}

#top_info_fdn_body dl dd{
padding:0 20px 16px;
line-height:1.4;
border-bottom:1px solid #5586cc;
border-left:6px solid #5286cc;
}

/* 研究助成 */
#top_info_fdn_body .ctgr01{
border-left:6px solid #3cb800;
}

/* 国内助成 */
#top_info_fdn_body .ctgr02{
border-left:6px solid #ff9d00;
}

/* 国際助成 */
#top_info_fdn_body .ctgr03{
border-left:6px solid #16a1ff;
}

/* その他のプログラム */
#top_info_fdn_body .ctgr04{
border-left:6px solid #b0b0b0;
}

/* 社会コミュニケーションプログラム */
#top_info_fdn_body .ctgr04c{
border-left:6px solid #9381ea;
}

/* イニシアティブプログラム */
#top_info_fdn_body .ctgr04i{
border-left:6px solid #fe6da3;
}

/* カイケツ */
#top_info_fdn_body .ctgr08{
border-left:6px solid #009fc2;
}

/* トヨタ財団について */
#top_info_fdn_body .ctgr06{
border-left:6px solid #5286cc;
}

/* 特定課題: 201904 Add */
#top_info_fdn_body .ctgr99{
border-left:6px solid #e83d23;
}



@media screen and (max-width: 360px) {
  #top_info_fdn_body{
  padding:0;
  height:auto;
  }

  #top_info_fdn_body dl{
  padding:0;
  height:auto;
  overflow:hidden;
  }

  #top_info_fdn_body dl dt{
  padding:10px 10px 0;
  font-size:100%;
  }

  #top_info_fdn_body dl dd{
  padding:0 10px 10px;
  }

  #top_info_fdn_body dl dd a{
  }
}


/* バナー
---------------------------------------------*/
#top_bnr_wrapper{
margin-bottom:30px;
}

#top_bnr{}

@media screen and (max-width: 360px) {
  #top_bnr_wrapper{
  margin-bottom:10px;
  }

  #top_bnr{}
}

#top_bnr > ul{
margin-right:-10px;
}

@media screen and (max-width: 360px) {
  #top_bnr > ul{
  margin-right:0;
  }
}

#top_bnr > ul > li{
float:left;
margin-right:10px;
width:320px;
width:237px;
text-align:center;
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li{
  float:none;
  margin-right:0;
  width:100%;
  }
}

#top_bnr > ul > li .top_bnr_each{
display:table;
width:100%;
}

#top_bnr > ul > li .top_bnr_each > a,
#top_bnr > ul > li .top_bnr_each > span{
position:relative;
display:table-cell;
height:58px;
font-size:129%;
line-height:1.2;
/*
font-weight:bold;
*/
color:#5586cc;
vertical-align:middle;
border:1px solid #cccccc;
cursor:pointer;
}

#top_bnr > ul > li.top_bnr_shinsai .top_bnr_each > a,
#top_bnr > ul > li.top_bnr_shinsai .top_bnr_each > span{
font-size:115%;
}



@media screen and (max-width: 360px) {
  #top_bnr > ul > li .top_bnr_each > a,
  #top_bnr > ul > li .top_bnr_each > span{
  border-top:0px;
  border-left:0px;
  border-right:0px;
  }

  #top_bnr > ul > li:first-child .top_bnr_each > a,
  #top_bnr > ul > li:first-child .top_bnr_each > span{
  border-top:1px solid #cccccc;
  }
}

#top_bnr > ul > li .top_bnr_each > a img{
vertical-align:middle;
}

#top_bnr > ul > li .top_bnr_each > a:hover{
text-decoration:none!important;
filter: alpha(opacity=80);
-moz-opacity:0.80;
opacity:0.80;
}

#top_bnr > ul > li .top_bnr_each > a:after{
position:absolute;
top:14px;
top:18px;
right:16px;

margin-right:0px;
/*
font-size:89%;
font-weight:normal;
*/
font-family:FontAwesome;
content: "\f105";
}

/* お問い合わせ */
#top_bnr > ul > li.top_bnr_inquiry .top_bnr_each > a{
padding-left:28px;
}

#top_bnr > ul > li.top_bnr_inquiry .top_bnr_each > a:before{
position:absolute;
top:10px;
left:20px;
content:url(./common/img/icn/icn_contact_l.png);
}

/* 助成対象検索 */
#top_bnr > ul > li.top_bnr_search .top_bnr_each > a{
padding-left:14px;
}

#top_bnr > ul > li.top_bnr_search .top_bnr_each > a:before{
position:absolute;
top:10px;
left:20px;
content:url(./common/img/icn/icn_search_l.png);
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li.top_bnr_search .top_bnr_each > a{
  padding-left:28px;
  }

  #top_bnr > ul > li.top_bnr_search .top_bnr_each > a:before{
/*
  left:72px;
*/
  }
}

/* 助成FAQ */
#top_bnr > ul > li.top_bnr_faq .top_bnr_each > a{
padding-left:0px;
}

#top_bnr > ul > li.top_bnr_faq .top_bnr_each > a:before{
position:absolute;
top:10px;
left:20px;
content:url(./common/img/icn/icn_faq_l.png);
}



/* 東日本大震災に関する取り組み */
#top_bnr > ul > li.top_bnr_shinsai{}

#top_bnr > ul > li.top_bnr_shinsai .top_bnr_each > a{
padding-left:20px;
color:#ffffff;
background-color:#81ad12;
}

#top_bnr > ul > li.top_bnr_shinsai .top_bnr_each > a:before{
position:absolute;
top:16px;
left:20px;
content:url(./common/img/icn/icn_hands_l.png);
}


/* 広報誌JOINT */
#top_bnr > ul > li.top_bnr_joint{
position:relative;
}

#top_bnr > ul > li.top_bnr_joint .top_bnr_each > a,
#top_bnr > ul > li.top_bnr_joint .top_bnr_each > span{
padding-left:20px;
color:#ffffff;
background-color:#81ad12;
}

#top_bnr > ul > li.top_bnr_joint .top_bnr_each > a:before,
#top_bnr > ul > li.top_bnr_joint .top_bnr_each > span:before{
position:absolute;
top:16px;
left:20px;
content:url(./common/img/icn/icn_hands_l.png);
}

/* JOINTサブメニュー -----------*/
#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu{
display:none;
/*
opacity:0;
transition:0.3s;
*/
}

#top_bnr > ul > li.top_bnr_joint:hover .top_bnr_joint_menu{
display:block;
/*
opacity:1;
*/
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu{
  display:block;
  }

  #top_bnr > ul > li.top_bnr_joint:hover .top_bnr_joint_menu{
  display:block;
  }
}



#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu{
position:absolute;
z-index:2;
top:60px;
left:0px;
width:100%;
opacity:0.9;

/*
outline:1px solid #f00000;
*/
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu{
  position:relative;
  top:0px;
  left:0px;
  }
}



#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul{
border-top:1px solid #d1ff5c;
}

#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li{
text-align:left;
border-bottom:1px solid #d1ff5c;
}

#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a{
position:relative;
display:block;
padding:12px 10px 12px 20px;
color:#ffffff;
background-color:#96c02c;
transition:0.3s;
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a{
  padding:12px 10px 12px 30px;
  font-size:112.5%;
  }

  #top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a:after{
  position:absolute;
  top:25%;
  right:15px;
  font-family:FontAwesome;
  content: "\f105";
  }
}



#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a:hover{
text-decoration:none;
background-color:#81ad12;
}

#top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a::before{
margin-right:3px;
font-family:FontAwesome;
content: "\f04b";
}

@media screen and (max-width: 360px) {
  #top_bnr > ul > li.top_bnr_joint .top_bnr_joint_menu ul li a::before{
  margin-right:0px;
  content:none;
  }
}








/* 以下、画像タイプ:不要 */
#topbnr_wrapper{
margin-bottom:30px;
}

#topbnr{}

@media screen and (max-width: 360px) {
  #topbnr_wrapper{
  margin-bottom:10px;
  }

  #topbnr{}
}

#topbnr ul{
padding-left:54px;
}

#topbnr ul li{
float:left;
margin-right:10px;
width:284px;
}
#topbnr ul li img{
width:100%;
height:auto;
}

@media screen and (max-width: 360px) {
  #topbnr ul{
  padding-left:0;
  }

  #topbnr ul li{
  float:left;
  margin-right:0;
  width:50%;

  margin:0 auto 3px;
  float:none;
  width:284px;
  text-align:center;

  }
}
/* 以上、画像タイプ:不要 */


/*--------------------------------------------------------------------
2. メインコンテンツ
--------------------------------------------------------------------*/
#top_mainconts_wrapper{}

#top_mainconts{
padding-bottom:30px;
}

@media screen and (max-width: 360px) {
  #top_mainconts{
  padding:0;
  }
}

/* イベント等のお知らせ、プロジェクトリポート
---------------------------------------------*/
#top_info_event_wrapper{
margin-bottom:30px;
}

#top_info_event{}

#top_repo_prj_wrapper{
margin-bottom:30px;
}

#top_repo_prj{}

@media screen and (max-width: 360px) {
  #top_info_event_wrapper{
  margin-bottom:0;
  }

  #top_info_event{}

  #top_repo_prj_wrapper{
  margin-bottom:0;
  }

  #top_repo_prj{}
}

/* 見出し: 共通 ----------*/
.ttl_top_cnr_wrapper{
position:relative;
}

.ttl_top_cnr{}

.ttl_top_cnr h2{
padding:0 24px;
height:60px;
font-size:129%;
line-height:60px;
color:#ffffff;
background: #5586cc;
}

@media screen and (max-width: 360px) {
  .ttl_top_cnr h2{
  padding-left:1em;
  height:46px;
  font-size:115%;
  line-height:46px;
  text-align:left;
  }
}

/* 一覧 ---------- */
.top_infogen_wrapper{}

.top_infogen{
padding:20px 20px 10px!important;
background-color:#e8edf3;
}

@media screen and (max-width: 360px) {
  .top_infogen{
  padding:10px 10px 0!important;
  background-color:#e8edf3;
  }
}

.top_infogen ul{
margin-right:-10px!important;
}

.top_infogen .top_info_gen_unit{
float:left;
margin-right:10px;
margin-bottom:10px;
width:465px;
width:464px;
min-height:150px;
background-color:#ffffff;
}

.top_infogen .top_info_gen_unit_inner{
padding:10px;
}

@media screen and (max-width: 360px) {
  .top_infogen ul{
  margin-right:0px!important;
  }

  .top_infogen .top_info_gen_unit{
  float:none;
  margin-right:0px;
  margin-bottom:10px;
  width:100%;
  min-height:initial;
  min-height:auto;
  }

  .top_infogen .top_info_gen_unit_inner{
  padding:10px;
  }
}


.top_infogen .tig_fig{
float:left;
width:128px;
/*
height:128px;
overflow:hidden;
*/
}

.top_infogen .tig_fig img{
width:100%;
height:auto;
}

@media screen and (max-width: 360px) {
  .top_infogen .tig_fig{
  width:86px;
  width:26%;
  }
}

.detail_box{
float:right;
width:305px;
}

@media screen and (max-width: 360px) {
  .detail_box{
  width:226px;
  width:72%;
  }
}


.ctg_name{
display:table;
margin-bottom:12px!important;
width:100%;
}

.ctg_name h3{
display:table-cell;
width:125px;
width:10em;
height:32px;
text-align:center;
color:#ffffff;
background-color:#999999;
vertical-align:middle;
}

@media screen and (max-width: 360px) {
  .ctg_name h3{
  font-size:93%;
  }
}

/* 研究助成 */
.ctgr01 .ctg_name h3{
background-color:#3cb800;
}

/* 国内助成 */
.ctgr02 .ctg_name h3{
background-color:#b0b0b0;
background-color:#ff9d00;
}

/* 国際助成 */
.ctgr03 .ctg_name h3{
background-color:#16a1ff;
}

/* その他のプログラム */
.ctgr04 .ctg_name h3{
background-color:#b0b0b0;
}

/* 社会コミュニケーションプログラム */
.ctgr04c .ctg_name h3{
background-color:#9381ea;
}

/* イニシアティブプログラム */
.ctgr04i .ctg_name h3{
background-color:#fe6da3;
}

/* カイケツ */
.ctgr08 .ctg_name h3{
background-color:#009fc2;
}

/* トヨタ財団について */
/*
.ctgr06 .ctg_name h3{
background-color:#5286cc;
}
*/

/* 特定課題: 201904 Add */
.ctgr99 .ctg_name h3{
background-color:#e83d23;
}



.ctg_name p{
display:table-cell;
padding-left:10px;
font-size:86%;
line-height:1.2;
color:#ffffff;
background-color:#bebebe;
vertical-align:middle;
}

@media screen and (max-width: 360px) {
  .ctg_name p{
  font-size:79%;
  }
}





.top_infogen dl{
padding:0 10px;
}

@media screen and (max-width: 360px) {
  .top_infogen dl{
  padding:0;
  }
}

.top_infogen dt{
margin-bottom:2px;
font-size:86%;
}

.top_infogen dt img{
vertical-align:middle!important;
}

.top_infogen dd{}


/* Isotope ----------------------*/
#btn_fltitm{
position:absolute;
top:18px;
right:20px;
padding:0 30px;
height:42px;
line-height:42px;
text-align:center;
color:#ffffff!important;
background-color:#3b68c5;
cursor:pointer;
}

@media screen and (max-width: 360px) {
  #btn_fltitm{
  position:absolute;
  top:10px;
  right:0;
  padding:0 10px;
  height:36px;
  line-height:36px;
  text-align:center;
  color:#ffffff!important;
  background-color:#3b68c5;
  cursor:pointer;
  }
}

#btn_fltitm:hover{
text-decoration:none!important;
filter: alpha(opacity=80);
-moz-opacity:0.80;
opacity:0.80;
}

#btn_fltitm:before{
content:'▼';
margin-right:6px;
color:#88ade1;
}

#btn_fltitm.dispOn:before{
content:'▲';
}

/* 抽出メニュー */
#filter_wrapper{
padding:10px;
background-color:#6fa0e5;
background-color:#a4c3ef;
}

#fltmenu01{
float:left;
}

#fltmenu02{
float:right;
}

.fltmenu{
width:49%;
}

@media screen and (max-width: 360px) {
  #fltmenu01{
/*
  width:39%;
*/
  }

  #fltmenu02{
/*
  width:59%;
*/
  }

  .fltmenu{}
}

.fltmenu h3{
color:#ffffff;
}

.fltmenu ul{}

.fltmenu li{}

.fltmenu li a{
display:block;
margin-bottom:10px;
padding:0 10px;
height:30px;
line-height:30px;
}

@media screen and (max-width: 360px) {
  .fltmenu ul{
  width:100%;
  }

  .fltmenu li > div{
  display:table;
  margin-bottom:5px;
  width:100%!important;
  }

  .fltmenu li a{
  display:table-cell;
  vertical-align:middle;
  margin-bottom:0;
  padding:0 5px;
  height:auto;
  height:40px;
  min-height:40px;
  line-height:1.2;
  font-size:86%;
  }
}


.fltmenu li a:hover{
text-decoration:none!important;
filter: alpha(opacity=80);
-moz-opacity:0.80;
opacity:0.80;
}

.fltmenu li a.selected{}

/* プロジェクトカテゴリ */
#filter_prj li a{
color:#ffffff!important;
}

#filter_prj li:nth-child(1) a{
background-color:#e83d23;
}
#filter_prj li:nth-child(2) a{
background-color:#3cb800;
}
#filter_prj li:nth-child(3) a{
background-color:#ff9d00;
}
#filter_prj li:nth-child(4) a{
background-color:#16a1ff;
}
#filter_prj li:nth-child(5) a{
background-color:#b0b0b0;
}

/* 情報カテゴリ */
#filter_info  li a{
color:#333333;
background-color:#ffffff;
}

#filter_info li:nth-child(1) a{}
#filter_info li:nth-child(2) a{}
#filter_info li:nth-child(3) a{}
#filter_info li:nth-child(4) a{
color:#ffffff;
background-color:#009fc2;
}

/* すべて */
#filter_all{}

#filter_all li{}

#filter_all a{
display:block;
margin-bottom:10px;
padding:0 10px;
height:30px;
line-height:30px;
text-align:center;
color:#333333;
background-color:#ffffff;
}

#filter_all a:hover{
text-decoration:none!important;
filter: alpha(opacity=80);
-moz-opacity:0.80;
opacity:0.80;
}

/* CMSKIT NEWアイコン */
.top_infogen .top_info_gen_unit dl dt > span{
position:relative;
top:-2px;
margin-left:0.5em;
}


/* Facebook、Joint Information
---------------------------------------------*/
#top_fb_joint_wrapper{
padding-bottom:20px;
}

@media screen and (max-width: 360px) {
  #top_fb_joint_wrapper{
  padding-bottom:0;
  }
}

/* FaceBook PagePlugin */
#fbpageplugin_wrapper{
float:left;
padding:0;
width:485px;
height:335px;
}

#fbpageplugin_wrapper .fb-page,
#fbpageplugin_wrapper .fb-page iframe{}


@media screen and (max-width: 360px) {
  #fbpageplugin_wrapper{
  float:none;
/*
  margin-bottom:20px;
*/
  padding:10px 0;
  width:100%;
  text-align:center;
  }

  #fbpageplugin_wrapper .fb-page{}
}

/* Joint Information */
#top_jointinfo{
float:right;
width:483px;
height:333px;
border:1px solid #d3d3d3;
background-color:#f5f5f5;
overflow:hidden;
}

#wcv_sys_edit_pageeditarea #top_jointinfo{
width:500px;
height:auto;
overflow:auto;
}

#top_jointinfo_inner{}

@media screen and (max-width: 360px) {
  #top_jointinfo{
  float:none;
  width:100%;
  height:auto;
  border:0px;
  }

  #top_jointinfo_inner{
  padding:20px;
  }
}

#top_jointinfo .img_gen{
float:left;
border-right:1px solid #d3d3d3;
}

#top_jointinfo .img_gen img{
width:100%;
height:auto;
}

@media screen and (max-width: 360px) {
  #top_jointinfo .img_gen{
  float:left;
  margin-right:16px;
  margin-bottom:16px;
  width:40%;
  border:1px solid #d3d3d3;
  }
}

#top_jointinfo_detail{
float:right;
width:170px;
padding:26px 20px 0;
}

#top_jointinfo_detail h2{
margin-bottom:10px;
font-size:115%;
font-weight:bold;
line-height:1.4;
}

@media screen and (max-width: 360px) {
  #top_jointinfo_detail{
  float:none;
  width:100%;
  padding:0;
  }
}