/*
* @package WordPress
* @subpackage RGUEXC by Santai
*/

/* eye
----------------------------------------------------------------------------------------------------*/
.carousel{margin-bottom:3em;}
.carousel-inner{position:static;}
.carousel-indicators{position:static; margin:0 .5em; z-index:2;}
.carousel-indicators li{width:auto; height:auto; margin:0; padding:.6em .3rem;}
.carousel-indicators li img{width:100%; border:.5px solid #dddddd;opacity: 0.6;  filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)";
	-webkit-transition: all .3s;
	transition: all .3s;}
.carousel-indicators .active img,.carousel-indicators li:hover img{opacity: 1;  filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)";}
.carousel-control-next, .carousel-control-prev{position:static; width:40%;}

.topbutton{
  position: absolute;
  left: 3%;
  bottom: 20%;
  width: 80px;
}
#topnews .modal-content{
  border:5px solid #5aa61f;
  border-radius: 0;
}
#topnews .modal-header h2{
  width: 100%;
  text-align: center;
  color: #aaaaaa;
}

@media (min-width:576px) {
  .topbutton{width: auto;}
}
@media (min-width: 768px) {
  .carousel-indicators li{padding:1.2em .3rem;}
}

/* layout
----------------------------------------------------------------------------------------------------*/
main{overflow: hidden;}
@media (min-width: 992px) {
#index section{margin:4em 0;}
}
#index section:first-child div.wrap{
  background:none;
  background-color:#bfebff;
}
@media (min-width:575px) {
  #index section:first-child div.wrap{
    background-size: contain;
  }
}
@media (min-width: 992px) {
#index section:first-child div.wrap{
  background:url(/wp-content/themes/exc/img/bg_pickup.png) left bottom no-repeat;
}
}

@media (min-width: 768px) {
  #index section:nth-child(2) div.wrap{
    background: url(/wp-content/themes/exc/img/bg_news.jpg) right center no-repeat;
    background-size: contain;
  }
#index section:last-child div.wrap{
  background: url(/wp-content/themes/exc/img/bg_link.jpg) left center no-repeat;
  background-size: contain;
}
}

#index section h2{margin-bottom:0.8em; color:#aaaaaa; font-size:4.5rem; text-align:center;}
#index section h2 small{display:block; color:#333333; font-size:1.2rem; margin-top:10px;}

div.wrap{
  padding:3em 0;
  background-color:transparent;
  position: relative;
}

#index .btn{color:#ffffff; background-color:#aaaaaa; line-height:1; padding:.4rem .9rem;}
#index .btn:hover{color:#aaaaaa; background-color:#ffffff; border:1px solid #aaaaaa;}

#index div.container_l{margin:auto; left:0 ;right:0; z-index:2; width:100%; position: absolute;}

#index section#pickup{margin-top:0;}
#index section#pickup div.wrap > div{top:-4.5em;}
  #index section#pickup div.wrap{padding:0 0 3.5em;}
  #index section#pickup div.wrap > div.container_l{position:static; padding:0 15px;}
  #index section#pickup h2{color:#ffffff;padding-top:.8em;}
    
  @media (min-width: 992px) {
    #index section#pickup{margin-top:4em;}
    #index section#pickup div.wrap{padding-top:calc(3em + 90px); background-size: contain;}
      #index section#pickup div.wrap > div.container_l{position: absolute;}
      #index section#pickup div.row > div{margin-bottom:0px;}
      #index section#pickup h2{text-align:left; color:#aaaaaa;padding:0;}
    }

#index section#news div.container_ss{background-color: rgba(255,255,255,.4);}

#index section:nth-child(3) div.wrap{
  background-size: 100%;
  color: #ffffff;
  padding:0;
  overflow:hidden;
}
#index section#about div.wrap:before{position: absolute; content: ''; background:none; background-color:#082f68; width:100%; margin:auto; height:100%; top:0; bottom:0; left:0; right:0; z-index:-3; display:block; background-size:1170px 15px;}

#index section#about div.wrap div.container p{margin-bottom:0;}
#index section#about div.wrap div.container_l{position:static; padding:0 15px; margin-top:3em;}
#index section#about h2{line-height:1;text-align:center; color:#ffffff;}
#index section#about h3{margin-top:.1em;}
  #index section#about div.wrap div.container{padding-bottom:3rem;}
  #index section#about div.banner a{display:block; position: relative; flex:1;}
  #index section#about div.banner a > div{position: absolute; top:0; bottom:0; left:0; right:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:0px;background-color:rgba(0, 0, 0, 0.2);
    -webkit-transition: all .3s; transition: all .3s;}
  #index section#about div.banner a:hover > div{background-color:rgba(0, 0, 0, 0.7);}
  #index section#about div.banner a > div > span{color:#ffffff; border:#ffffff 1px solid; display:flex;align-items:center; justify-content:center; -webkit-transition: all .3s; transition: all .3s;padding:1em 4.5em; font-size:1.5rem;}
  #index section#about div.banner a:hover > div > span{color:#333333; background-color:#ffffff;}
  #index section#about div.banner a:last-child{margin-bottom:0px;}
@media (min-width: 768px) {
  #index section#about div.banner a > div{padding:0px;}
  #index section#about div.banner{display:flex;}
}
@media (min-width: 992px) {
  #index section:nth-child(3) div.wrap{padding-bottom:3em;}
  #index section#about div.wrap:before{background:#082f68 url(/wp-content/themes/exc/img/sdgs_bar.png) right bottom repeat-x;background-size:1170px 15px;}
  
#index section#about div.wrap > div.wrap_inner01:before{position: absolute; background-color:#ffffff; content: ''; width:calc((100% - 1200px) / 2); margin:auto; height:100%; top:0; bottom:0; left:0; z-index:-2; display:block;}
#index section#about div.wrap div.wrap_inner01:after{position: absolute; background: url(/wp-content/themes/exc/img/stars.png) right center no-repeat; background-size:contain; content: ''; width:100%; margin:auto; top:0; bottom:15px; left:0; right:0; z-index:-1; display:block;}
}
@media (min-width:1200px) {
  #index section#about h2{color:#aaaaaa;}
  #index section#about div.wrap div.container_l{display:flex;}
}

#index section#insta div.wrap{background:#5aa61f;}
#index section#insta h2{color:#ffffff;}
@media (min-width: 768px) {
  #index section#insta div.wrap > div:first-child{padding:0;}
}
@media (min-width: 992px) {
#index section#insta div.wrap > div:first-child{display:flex; justify-content:flex-end; padding:0 15px;}
  #index section#insta div.wrap{background:transparent; padding-top:0;}
#index section#insta div.wrap:before{display: block; content: ''; position: absolute; width:100%; background:#5aa61f url(/wp-content/themes/exc/img/bg_insta.png) left bottom no-repeat; top:0; bottom:0; z-index:-2; background-size:contain;}

#index section#insta div.wrap:before{width:calc(50% - 5px); background-size:cover;}
  #index section#insta h2{width:calc(50% - 30px); padding:0 15px 0 0; color:#aaaaaa; text-align:left;}
  #index section#insta div.wrap:after{
    position: absolute; background: url(/wp-content/themes/exc/img/sdgs_bar.png) right bottom repeat-x;content: ''; width:50%; margin:auto; height:15px; bottom:0; left:0; z-index:-1; display:block; background-size:1170px 15px;
  }
#index section#insta div.wrap:after{width:calc(50% - 5px);}
}


#link .container > div{width:100%;}
ul.top_link{list-style-type:none; margin:0; padding:0; display:block;}
ul.top_link > li a{margin:5px; border:1px solid #cccccc; display:flex; padding:1em; background-color:#ffffff; flex-grow:1; align-items:center; justify-content:center;}
ul.top_link > li a:hover{text-decoration:none; background-color:#5aa61f; color:#ffffff;}
@media (min-width:576px) {
#link .container{display:flex; justify-content:flex-end;}
ul.top_link{display:flex; flex-wrap:wrap;}
ul.top_link > li{display:flex; flex-basis: 50%; max-width:50%;}
}
@media (min-width: 768px) {
  ul.top_link > li{flex-basis: 25%; max-width:25%;}
}
@media (min-width: 992px) {
  #index section#link h2{text-align:left;}
}

/* 新着情報
------------------------------------------------------------------------------*/
#news .topics ul.nav{
  text-align: center;
  margin-bottom: 2rem;
}
#news .topics ul.nav li{
  width: 25%;
  border-right: 1px solid #aaaaaa;
}
#news .topics ul.nav li:first-child{border-left: 1px solid #aaaaaa;}
#news .topics ul.nav li a{padding: .3em;}
#news .topics ul.nav li a.active{background-color: #5aa61f; color:#ffffff;}