@charset "Shift_JIS";

/*  Top Contents
-----------------------------------------------------------------------------*/
#tab_area {
  height: 316px;
  margin-bottom: 30px;
}

#tab_area #tab_nav li {
  padding: 11px 0 10px;
  border-left: 5px solid #FFF;
  width: 199px;
  background: url(../../img/tabbg_off.gif) 0 0 no-repeat;
  float: left;
}

#tab_area #tab_nav li a {
  text-align: center;
  display: block;
}

#tab_area #tab_nav li.select { background: url(../../img/tabbg_on.gif) 0 0 no-repeat; }

#tab_area #tab_nav {
  zoom: 1;
  border-bottom: 4px solid #74ac3d;
}

#tab_area #tab_nav:after {
  height: 0;
  display: block;
  clear: both;
  content: " ";
}

#tab_area #tab_content .link_tab { zoom: 1; }
#tab_area #tab_content .none { display: none; }

#tab_area #tab_content .link_tab:after {
  height: 0;
  display: block;
  clear: both;
  content: " ";
}

#tab_area #tab_content .link_tab {
  padding: 10px 0;
  border-bottom: dotted 1px #aba6a6;
  background: #fafad1;
}

#tab_area #tab_content .link_tab li {
  padding: 5px 0;
  border-right: 10px solid #fafad1;
  width: 115px;
  background: url(../../img/tab_sbtn.gif) 0 0 no-repeat;
  float: right;
}

#tab_area #tab_content .link_tab li a {
  color: #FFF;
  text-decoration: none;
  text-indent: 18px;
  padding-left: 10px;
  display: block;
}

#tab_area #tab_content .link_tab li a:hover { color: #666; }

#tab_area #tab_content dt {
  padding: 10px 0 10px 10px;
  position: absolute;
}

#tab_area #tab_content dd {
  padding: 10px 10px 10px 170px;
  border-bottom: dotted 1px #aba6a6;
  background: url(../../img/icon_arrow02.gif) 150px 13px no-repeat;
}

#tab_area #tab_content dd a { text-decoration: none; }
#tab_area #tab_content dd a:hover { color: #666; }

.in_main_cont {
  position: relative;
}

.in_main_cont #topmain_illust{
  left: 470px !important;
  bottom: 15px !important;
}

.in_main_cont .pickup{
  position: absolute;
  right: 0;
  width: 270px;
  height: 110px;
  background: url(../../img/pickup_bg.gif) no-repeat;
  font-size: 21px;
  text-align: center;
  line-height: 114px;
}

#pickup_area .pickup:first-of-type{top: 20px;}
#pickup_area .pickup:nth-child(3){bottom: 20px;}
#pickup_area .pickup:nth-child(2){
  top: 50%;
  transform: translate(0, -50%);
}




#count {
  width: 204px;
  height: 303px;
  background: url(../../img/count_bg.png) 2px 0 no-repeat;
  float: left;
  position: relative;
}

#count .day {
  font-size: 60px;
  color: #fdd856;
  line-height: 60px;
  text-align: right;
  width: 110px;
  top: 105px;
  left: 48px; 
  position: absolute;
}

#count .top_saru {
  top: 127px;
  left: 10px;
  position: absolute;
}

#count .top_dog {
  right: 37px;
  bottom: 9px;
  position: absolute;
}

/* calendar */
#calendar_box {
  margin-bottom: 17px;
  background: url(../../img/calendar_bg2.gif) left bottom no-repeat;
}

#calendar_box h2 { margin-bottom: 10px; }

#calendar_box ul {
  zoom: 1;
  padding: 0 8px 8px 8px;
}

#calendar_box ul:after {
  height: 0;
  display: block;
  clear: both;
  content: " ";
}

#calendar_box li.prev { float: left; }
#calendar_box li.next { float: right; }

#calendar_box div.event {
  padding-bottom: 10px;
}

#calendar_box div.event .event_cont {
    box-sizing: border-box;
  padding: 5px;
  background: #ffc90c;
  border-radius: 5px;
  margin: 0 auto;
  display: block;
  width: 254px;
}

#calendar_box div.event .event_cont p a {
  display: block;
  box-sizing: border-box;
  text-decoration: none;
  color: #562c12;
  font-size: 18px;
  font-weight: bold;
  background: url(../../img/arrow_orange.png) 225px center no-repeat;
  background-color: #fff;
  width: 244px;
  height: 49px;
  line-height: 49px;
  border-radius: 5px;
  text-align: center;
  letter-spacing: 1px;
}

#calendar_box div.event_cont .btn_search{padding-bottom: 5px;}
#calendar_box div.event_cont .btn_search a span {
  padding-left: 33px;
  background: url(../../img/icon_search.png) left center no-repeat;
}

#calendar_box div.event_cont .btn_post a span {
  padding-left: 33px;
  background: url(../../img/icon_pencil.png) left center no-repeat;
}

#calendar_box table {
  margin: 0 auto 15px auto;
  width: 230px;
  background: url(../../img/calendar_line.gif) center top no-repeat;
}

#calendar_box div.event .event_cont p a:hover{
  background-color: #ffe9cd;
}

#calendar_box table caption {
  font-weight: bold;
  color: #562c12;
  line-height: 21px;
  padding: 0 0 20px 0;
  overflow: hidden;
}

#calendar_box table td {
  text-align: center;
  padding: 4px 0 5px 0;
}

#calendar_box table td a { color: #333333; }

#calendar_box table thead th {
  color: #562c12;
  padding-bottom: 5px;
}

#calendar_box table td.today {
  font-weight: bold;
  background: #74ac3d !important;
}

#calendar_box table td.today a { color: #FFF; }
#calendar_box table .sat { color: #119fd6; }

#calendar_box table .sun {
  color: #de3941;
  border-right: none;
}

/* side_banner */
#side_banner .bnr_style a {
  position: relative;
  display: block;
  box-sizing: border-box;
  border: 3px solid #dbdbdb;
  border-radius: 5px 0 5px 0;
  width: 270px;
  height: 64px;
  text-decoration: none;
  color: #000;
  font-size: 16px;
  line-height: 60px;
  padding-left: 65px;
  background: #fff;
  overflow: hidden;
}

#side_banner .bnr_style a:after {
  content: '';
  position: absolute;
  border-left: 15px solid #fdfb71;
  bottom: 0;
  right: -20px;
  width: 10px;
  height: 10px;
  -webkit-transform: skewX(130deg);
  -moz-transform: skewX(130deg);
  transform: skewX(130deg);
}

#side_banner .bnr_style a:hover {
  background-color: #f5f5f5 !important;
}

#side_banner #tourism a {
  background: url(../../img/icon_bicycle.png) no-repeat -7px center;
  line-height: 20px;
  padding-top: 10px;
}

#side_banner #world a {background: url(../../img/icon_earth.png) no-repeat 10px center;}
#side_banner #movie a {background: url(../../img/icon_movie.png) no-repeat 10px center;}

/* contents */
#main_area {
  zoom: 1;
  margin-left: -20px;
}

#main_area:after {
  height: 0;
  display: block;
  clear: both;
  content: " ";
}

#main_area .box {
  margin-bottom: 15px;
  padding-bottom: 25px;
  border-left: 20px solid #FFF;
  width: 330px;
  float: left;
}

#main_area .in_box { padding: 0 20px; }

#main_area .in_box .btn {
  padding-bottom: 10px;
  display: block;
}

#main_area ul { zoom: 1; }

#main_area ul:after {
  height: 0;
  display: block;
  clear: both;
  content: " ";
}

#main_area .box_half {width: 335px;}
#main_area .box_full {width: 100%;}

#main_area .box_half,
#main_area .box_full {
  padding: 10px;
  box-sizing: border-box;
}

#main_area .box_half > div{width: 315px;}

#main_area .box_half > div,
#main_area .box_full > div {
  margin: 0 auto;  
  padding: 13px;
  box-sizing: border-box;
  background: #fff;
}

#main_area .box_half > div > ul {margin: 15px 0 0 7px;}

.st_link:hover {opacity: .7;}

#main_area #top_group1{ background: url(../../img/area_bg1.gif); }
#main_area #top_group2{ background: url(../../img/area_bg2.gif); }
#main_area #top_group3{ background: url(../../img/area_bg3.gif); }
#main_area #top_group4{ background: url(../../img/area_bg4.gif); }
#main_area #top_group5{ background: url(../../img/area_bg5.gif); }

#top_group1,#top_group4 {float: left;}
#top_group2,#top_group5 {float: right;}
#top_group1,#top_group2 {margin-bottom: 20px;}
#top_group4,#top_group5 {margin-top: 20px;}

#main_area .item_list1 li {
  margin-bottom: 10px;
  padding-left: 10px;
  background: url(../../img/icon_arrow02.gif) 0 2px no-repeat;
}

#main_area .item_list2 li{
  margin-bottom: 10px;
  padding-left: 10px;
  background: url(../../img/icon_arrow02.gif) 0 2px no-repeat;
}

#main_area .item_list4 > li:first-of-type{
  margin-bottom: 10px;
}
#main_area .item_list4 > li > a{
  padding-left: 23px;
  font-size: 16px;
  background: url(../../img/icon_arrow03.gif) no-repeat;
}

#main_area .item_list4 > li ul li{
  display: inline-block;
  width: 45%;
  margin-bottom: 10px;
  padding-left: 10px;
  background: url(../../img/icon_arrow02.gif) 0 2px no-repeat;
}

#top_group4 div > ul > li > a{font-weight: bold;}
#top_group4 ul li ul{margin-top: 13px;}

/* SDGs */
#main_area #top_group3{ color: #2f2f2f; }

#main_area #top_group3 .st_txt {
  font-size: 25px;
  font-weight: bold;
  line-height: 1.2em;
  letter-spacing: 1px;
  margin-top: 15px;
}

#main_area #top_group3 .st_txt span {color: #00a0e9;}
#main_area #top_group3 .tc{text-align: center;}
#main_area #top_group3 .marker {
  display: block;
  width: 196px;
  font-size: 16px;
  margin: 15px auto 22px auto;
  background: linear-gradient(transparent 30%, #fdf68c 30%);
}

#main_area #top_group3 .icon_list {
  font-size: 0;
  text-align: center;
}

#main_area #top_group3 .icon_list li {
  display: inline-block;
  margin: 5px;
}

#main_area #top_group3 #group3_txt {
  margin: 15px;
  font-size: 14px;
}

.goal_detail dl {
  box-sizing: border-box;
  position: absolute;
  border-width: 3px;
  border-style: solid;
  width: 244px;
  background: #fff;
  display: none;
}

.goal_detail dl dt {
  text-align: center;
  margin-top: 13px;
}

.goal_detail dl  dd:first-of-type {
  width: 215px;
  margin: 10px auto;
}

.goal_detail dl dd a {
  display: block;
  text-decoration: none;
  color: #fff;
  font-size: 12px;
  padding: 5px 0;
  text-align: center;
}

.goal_detail dl dd a span {
  padding-right: 14px;
  background: url(../../img/arrow_white.png) right 3px no-repeat;
}

#icon_hover {
  position: relative;
}

.goal_detail .goal1{ border-color: #e5001e;top: 0; left: 0;}
.goal_detail .goal1 dd:last-of-type{background: #e5001e;}

.goal_detail .goal2{ border-color: #d7a600; top: 0; left: 45px;}
.goal_detail .goal2 dd:last-of-type{background: #d7a600;}

.goal_detail .goal3{ border-color: #00973b; top: 0; left: 150px;}
.goal_detail .goal3 dd:last-of-type{background: #00973b;}

.goal_detail .goal4{ border-color: #c60f28; top: 0; right: 150px;}
.goal_detail .goal4 dd:last-of-type{background: #c60f28;}

.goal_detail .goal5{ border-color: #e83819; top: 0; right: 45px;}
.goal_detail .goal5 dd:last-of-type{background: #e83819;}

.goal_detail .goal6{ border-color: #00a6d9; top: 0; right: 0;}
.goal_detail .goal6 dd:last-of-type{background: #00a6d9;}

.goal_detail .goal7{ border-color: #fabd00; top: 20px; left: 0;}
.goal_detail .goal7 dd:last-of-type{background: #fabd00;}

.goal_detail .goal8{ border-color: #970b31; top: 20px; left: 45px;}
.goal_detail .goal8 dd:last-of-type{background: #970b31;}

.goal_detail .goal9{ border-color: #ed6a02; top: 20px; left: 150px;}
.goal_detail .goal9 dd:last-of-type{background: #ed6a02;}

.goal_detail .goal10{ border-color: #dc007a; top: 20px; right: 150px;}
.goal_detail .goal10 dd:last-of-type{background: #dc007a;}

.goal_detail .goal11{ border-color: #f5a200; top: 20px; right: 45px;}
.goal_detail .goal11 dd:last-of-type{background: #f5a200;}

.goal_detail .goal12{ border-color: #d39200; top: 20px; right: 0px;}
.goal_detail .goal12 dd:last-of-type{background: #d39200;}

.goal_detail .goal13{ border-color: #427935; bottom: 0; left: 0;}
.goal_detail .goal13 dd:last-of-type{background: #427935;}

.goal_detail .goal14{ border-color: #0075ba; bottom: 0; left: 45px;}
.goal_detail .goal14 dd:last-of-type{background: #0075ba;}

.goal_detail .goal15{ border-color: #28a838; bottom: 0; left: 150px;}
.goal_detail .goal15 dd:last-of-type{background: #28a838;}

.goal_detail .goal16{ border-color: #004c88; bottom: 0; right: 150px;}
.goal_detail .goal16 dd:last-of-type{background: #004c88;}

.goal_detail .goal17{ border-color: #003067; bottom: 0; right: 45px;}
.goal_detail .goal17 dd:last-of-type{background: #003067;}

#main_area .btn_grouplist a{
  float: right;
  text-decoration: none;
  box-sizing: border-box;
  color: #2f2f2f;
  font-size: 16px;
  width: 330px;
  background: #f3f3f3;
  padding: 11px 19px;
  border: 2px solid #d8d8d8;
  border-radius: 10px;
  margin: 10px 0 30px;
}

#main_area .btn_grouplist a:hover {
  background-color: #e2e2e2;
}

#main_area .btn_grouplist a span{
  padding-left: 30px;
  background: url(../../img/icon_list.gif) no-repeat left 4px;
}



#main_area #top_group3 .column{
  float: left;
  width: 312px;
}

#main_area #top_group3 .blog{
  float: right;
  width: 322px;
  padding: 0 0 10px 10px;
  border-left: 1px dotted #9b9b9b;
}

#main_area #top_group3 .btn{
  display: block;
  padding-bottom: 10px;
}

#main_area #top_group3 .item_list3{
  background: #eef9fb;
  padding: 15px 20px 0 20px;
}

#main_area #top_group3 .item_list3 li{
  display: inline-block;
  width: 46%;
  margin-bottom: 15px;
}

#main_area .item_list3 li{
  padding-left: 23px;
  font-size: 16px;
  font-weight: bold;
  background: url(../../img/icon_arrow06.gif) no-repeat;
}

#facebook_area { margin-bottom: 30px; }

#contents #esd {
  width: 680px;
  height: 165px;
  background: url(../../img/esd_bg.gif) left top no-repeat;
  position: relative;
}

#contents #esd .image {
  left: -10px;
  position: absolute;
}

#contents #esd div.cmt140 {
  line-height: 24px;
  text-align: center;
  padding: 45px 17px 0 95px;
  position: absolute;
}