/* EPOC top css add */
@charset "utf-8";

.contents .main { padding-bottom: 0em;}
.contents .main section.news { padding-bottom: 0em;}
.contents .main section.news h2 { margin-bottom: 0.5em;}
.contents .main section dl.news { font-size: 0.9em;}
.contents .main section dl.news  { margin: 10px 10px 0px;}
.contents .main section dl.news dt,
.contents .main section dl.news dd { padding-top: 0.5em; padding-bottom: 0.5em;}
.contents .main section dl.news dt { width: 10em;}
.contents .main section dl.news dd { padding-left: 10em;}
.contents .main section dl.news dd:last-child { margin-bottom: 0em; border: none;}
.contents .main section .list_link { border-radius: 2em; top: 1.5em;}
.contents .main section .list_link a { padding: 0.3em 1em;}

footer .reread_link { z-index: 3;}

.slide_box { margin-bottom: 2em;}

.two_column ul { padding-bottom: 0em; margin-bottom: 1em;}
.two_column ul li a { display: block;}

.after section h2 { text-align: center; padding-bottom: 0.5em;}
.after section h2:before { left: 30%; right: 30%; width: auto;}

.after .contact {
    width: 1024px; margin-bottom: 2em; padding: 20px;
    background-color: rgba(216,219,228,1);
    background-image: -webkit-linear-gradient(-45deg,rgba(255,255,255,0.3) 15%, transparent 16%, transparent 50%, rgba(255,255,255,0.3) 51%,rgba(255,255,255,0.3) 65%, transparent 66%, transparent);
    background-image: linear-gradient(-45deg,rgba(255,255,255,0.3) 15%, transparent 16%, transparent 50%, rgba(255,255,255,0.3) 51%, rgba(255,255,255,0.3) 65%, transparent 66%, transparent);
    background-size: 6px 6px;
}
.after .contact section { padding-bottom: 5px;}
.after .contact a.button { display: block; width: 250px; margin: 2em auto 0; padding: 0.6em 1em; background-color: #0C4681; box-sizing: border-box; border-radius: 2em;}

section.group { width: auto; max-width: 1024px; margin: 0em auto 2em; padding: 20px; border: 1px solid #D8D7DC; box-sizing: border-box;}
section.group h2 {}

div.group { margin-bottom: 2em; padding: 18px 18px 0px; font-size: 1.1em; clear: both;}
section.group div.group:last-child { margin-bottom: 0em;}
div.group h3 { font-size: 1.3em;}

div.group dl { float: left; width: 32%; margin-left: 2%;}
div.group dl:nth-child(3n-1) {margin-left: 0%; clear: both;}
div.group dl dt { position: relative; font-size: 1.1em; z-index: 2;}
div.group dl dt a { position: relative; display: block; padding: 0.8em 3em 0.8em 1em; color: #ffffff; text-decoration: none; border-radius: 3em;}
div.group dl dt a:before { position: absolute; content: ""; display: block; width: 1.6em; height: 1.6em; top:50%; right: 0.8em; margin-top: -0.8em; background: url(../img/arrow_group.png) center center no-repeat; border-radius: 50%; border: 2px solid rgba(255,255,255,0);/* box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,1);*/ box-sizing: border-box;}
div.group dl dt a:hover:before,
div.group dl dt a:focus:before { border: 2px solid rgba(255,255,255,1);/* box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,1);*/}
div.group dl dt a.active:before { transform:rotate(180deg);}

/* slide item */
div.group dl dd { display: none; position: relative; margin: -1.5em 0px 0px; padding: 3em 1em 1em; background-color: #ffffff; z-index: 1; border-radius: 0em 0em 1em 1em;}
div.group dl dd ul { padding: 0em;}
div.group dl dd ul li { float: left; width: 46%; margin-left: 8%;}
div.group dl dd ul li:nth-child(2n-1) { margin-left: 0%;}
div.group dl dd ul li a {
  position: relative; display: block; padding: 0.65em 1em; color: #000000; text-align: center; text-decoration: none; font-size: 1.1em; font-weight: bold; border-radius: 2em; transition-duration: 0.2s;
  background-color: #A5BFDC;    
  background-image: -webkit-linear-gradient(-45deg,rgba(255,255,255,0.3) 15%, transparent 16%, transparent 50%, rgba(255,255,255,0.3) 51%,rgba(255,255,255,0.3) 65%, transparent 66%, transparent);
  background-image: linear-gradient(-45deg,rgba(255,255,255,0.3) 15%, transparent 16%, transparent 50%, rgba(255,255,255,0.3) 51%, rgba(255,255,255,0.3) 65%, transparent 66%, transparent);
  background-size: 6px 6px;  
}
div.group dl dd ul li a:before { position: absolute; content: ""; display: block; top: 0em; bottom: 0em; left: 1em; width: 12px; background: url(../img/arrow_campus.png) center center no-repeat; transition-duration: 0.2s;}
div.group dl dd ul li a:hover:before,
div.group dl dd ul li a:focus:before { left: 1.2em; background-image: url(../img/arrow_campus_on.png);}
div.group dl dd ul li.central a:hover,
div.group dl dd ul li.central a:focus { color: #ffffff; background-color: #225EAC; }
div.group dl dd ul li.east a:hover,
div.group dl dd ul li.east a:focus {color: #ffffff; background-color: #298900; }

/* group color */
/*----------------------------------------
  色設定はwww.go.jpのstyle.cssに記載
----------------------------------------*/

/* en add 20190314 */
.epoc.subtop.en.no_nav .contents .article h2 { margin:0 auto 1em; background: none;}
.epoc.subtop.en.no_nav div.group h3 { margin:0 auto 1em; padding:0; border: none;}

.contents .article div.group dl dd ul li { padding-left: 0;}
.contents .article div.group dl dd ul li:before { display: none;}


/*------------------------------------------------------------------------------
  レスポンシブ対応
------------------------------------------------------------------------------*/
@media screen and (min-width:0px) and (max-width:1044px){
  
  .after .contact,
  section.group { width: 95%; margin-left: auto; margin-right: auto;}

  .contents .main section dl.news dt { width: auto; padding-bottom: 0.2em;}
  .contents .main section dl.news dd { padding-left: 1em; padding-top: 0em;}
  
  div.group dl,
  div.group dl:nth-child(3n-1) { clear: none; float: left; width: 48%; margin-left: 4%;}
  div.group dl:nth-child(2n) { clear: both; margin-left: 0%;}

}

@media screen and (min-width:0px) and (max-width:788px){
  
  div.group dl,
  div.group dl:nth-child(3n-1),
  div.group dl:nth-child(2n) { clear: both; width: 100%; margin-left: 0%;}

}