﻿@charset "UTF-8";

em {
font-family: 'Hiragino Kaku Gothic ProN';
font-style: italic;
}

/* お知らせ
-------------------------------------------------------- */
/*#topics #columnL #side_topics {
  display: block !important;
}*/
#topics_inner {
	position: relative;
	z-index: 1;
}
#topics .tabs {
  max-width: 1000px;
  margin: 0 auto;
}
#topics .panel {
	min-height: 500px;
	background: #fff;
	display: none;
	overflow: auto;
	padding: 35px 0;
  max-width: 1000px;
  margin: 0 auto;
}
.news_list li {
  padding: 30px 15px;
}
.news_list {
  margin-bottom: 40px;
}
.pager {
  display: -webkit-flex;
  display: flex;
}
.pager li {
  margin-right: 10px;
}
.pager li:last-child {
  margin-right: 0;
}
.pager li span,
.pager li a {
  display: block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
  align-items: center;
}
.pager li span,
.pager li a:hover {
  background: #21b2c7;
  color: #fff;
}
.pager li a {
  border: solid 1px #21b2c7;
  color: #21b2c7;
}

.topic_ttl {
  display: flex;
  flex-wrap: wrap;
}
.topic_ttl span {
  display: block;
}
.topic_date {
  margin-right: 2em;
  font-weight: 700;
  font-size: 1.6rem;
}
.topic_cate {
  height: 25px;
  line-height: 25px;
  font-weight: 500;
  padding: 0 20px;
  margin-bottom: 20px;
  font-size: 1.4rem;
}
.topic_txt {
  width: 100%;
  font-size: 2rem;
  font-weight: 500;
  padding-bottom: 25px;
  margin-bottom: 25px;
  border-bottom: solid 1px #bababa;
}
#topic_wrap {
  max-width: 1000px;
  margin: 0 auto 70px;
}
.topic_content {
  padding-bottom: 30px;
  margin-bottom: 50px;
  border-bottom: solid 1px #bababa;
}
.topic_content p {
  margin-bottom: 30px;
}
.topic_content a {
  text-decoration: underline;
  color: #21b2c7;
}
#topic_wrap .btn01 {
  margin: 0 auto 50px;
}
#topic_wrap .btn01::after {
  right: inherit;
  left: 20px;
  top: 13px;
  background: url("../img/common/arrow01.png") no-repeat 0 0 /100%;
  transform: rotate(180deg);
}
@media screen and (max-width: 768px) {
#topics .tabs {
  max-width: 1000px;
  margin: 0 auto;
}
#topics .panel {
	min-height: 500px;
	background: #fff;
	display: none;
	overflow: auto;
	padding: 35px 0;
  max-width: 1000px;
  margin: 0 auto;
}
  .topic_txt {
  font-size: 1.8rem;
  padding-bottom: 15px;
  margin-bottom: 20px;
}
}

.topic_img{
  float:right;
  margin:0 15px 15px 15px;
  width:30%;
}

.topics_cat1{
	width: 100px;
	margin: 0 16px 0 0;
  background: #21b2c7;
  color: #fff;
  text-align: center;
  padding: 3px;
}


/* 部門紹介
-------------------------------------------------------- */
#greeting #side_about,
#overview #side_about,
#staff #side_about {
  display: block !important;
}


/* ------ご挨拶------- */
#greeting #columnR {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#greeting #columnR .text {
  width: 63%;
}
#greeting #columnR .text p {
  margin-bottom: 15px;
}
#greeting #columnR .photo {
  width: 32%;
}
#greeting #columnR .photo img {
  display: block;
  text-align: center;
}
#greeting #columnR .photo p {
  text-align: center;
  font-size: 1.6rem;
  margin-top: 10px;
}
#greeting #columnR .photo p span {
  font-size: 1.4rem;
  padding-right: 1.5rem;
}
@media screen and (max-width: 768px) {
  #greeting #columnR {
    display: block;
  }
  #greeting #columnR .text {
    width: 100%;
  }
  #greeting #columnR .photo {
    width: 70%;
    margin: 40px auto;
  }
}

/* ------目的・体制------- */

#overview figure {
  margin: 0 auto;
}

/* ------スタッフ------- */
#staff table {
  margin-bottom: 40px;
}
#staff table th {
  max-width: 265px;
}
#staff table th.ttl03 {
  width: 100% !important;
}
#staff table td {
  width: 70%;
}

/* 制度・サービス
-------------------------------------------------------- */
#service #side_service {
  display: block !important;
}
#service .sec02 h3 {
  margin-top: 40px;
}
#service .sec03 h4 {
  background: #ebfcff;
  color: #21b2c7;
  padding: 11px 20px;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 20px;
  border-bottom: none;
}
#service div.intro {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  flex-direction: row-reverse;
}
#service div.intro .left {
  width: 53.6%;
}
#service div.intro p {
  margin-bottom: 45px;
}
#service div.intro figure {
  width: 41.4%;
}
#service div.address {
  padding: 15px 20px 7px;
  background: #ebfcff;
}
#sv03 div.address, #sv04 div.address {
  margin-bottom: 55px;
}
#service div.address li {
  margin-bottom: 8px;
  font-size: 1.6rem;
}
#service div.address a {
  text-decoration: underline;
  color: #21b2c7;
}
#service .pdf {
  margin: 30px 0 20px; 
}
#service .flow li .btn01 {
  position: absolute;
  top: 20px;
  right: 20px;
}
#service2 p:first-of-type {
  font-size: 1.6rem;
}
.terms li {
  margin-top: 18px;
}
#sv05 .sec03 dl {
  margin: 1em 0 0;
}
#sv05 .sec03 dl dd:first-of-type {
  margin: 0 0 1em 0;
}
@media screen and (max-width: 1024px) {
  #service div.intro {
    display: block;
  }
  #service div.intro .left,
  #service div.intro figure {
    width: 100%;
    margin: 0 auto 50px;
  }
  #service div.intro figure {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  #service .flow > li .btn01 {
    position: inherit;
    top: inherit;
    right: inherit;
    min-width: inherit;
    font-size: 1.6rem;
    width: 100%;
    margin-top: 8px;
  }
  #service div.intro .left, #service div.intro figure {
    width: 100%;
    margin: 0 auto 20px;
  }
  #service div.intro p {
    margin-bottom: 20px;
  }
  #service div.intro .pdf {
    margin: 0 0 20px !important;
  }
  #service2 section:first-of-type {
    margin-top: 35px;
  }
}

/* 規約・各種様式
-------------------------------------------------------- */
#rules #columnL #side_data,
#doc_tpl #columnL #side_data {
  display: block !important;
}
#doc_tpl .pdf li span {
  padding-left: 1.5rem;
  font-weight: normal;
}

/* 実績紹介
-------------------------------------------------------- */
#case #columnL #side_achievement,
#data #columnL #side_achievement,
#report #columnL #side_achievement,
#research #columnL #side_achievement{
  display: block !important;
}

/* ------事例紹介------- */
.case {
  margin-bottom: 100px;
  min-height: 320px;
  padding-left: 41%;
  position: relative;
}
#case01 {background: url("../img/achievement/img_case01.jpg") no-repeat 0 0 / 35.555%;}
#case02 {background: url("../img/achievement/img_case02.jpg") no-repeat 0 0 / 35.555%;}
#case03 {background: url("../img/achievement/img_case03.jpg") no-repeat 0 0 / 35.555%;}
#case04 {background: url("../img/achievement/img_case04.jpg") no-repeat 0 0 / 35.555%;}
#case05 {background: url("../img/achievement/img_case05.jpg") no-repeat 0 0 / 35.555%;}
#case06 {background: url("../img/achievement/img_case06.png") no-repeat 0 0 / 35.555%;}
#case07 {background: url("../img/achievement/img_case07.jpg") no-repeat 0 0 / 35.555%;}
#case08 {background: url("../img/achievement/img_case08.jpg") no-repeat 0 0 / 35.555%;}
#case09 {background: url("../img/achievement/img_case09.jpg") no-repeat 0 0 / 35.555%;}
#case10 {background: url("../img/achievement/img_case10.png") no-repeat 0 0 / 35.555%;}
#case11 {background: url("../img/achievement/img_case11.jpg") no-repeat 0 0 / 35.555%;}
#case12 {background: url("../img/achievement/img_case12.jpg") no-repeat 0 0 / 35.555%;}
#case13 {background: url("../img/achievement/img_case13.jpg") no-repeat 0 0 / 35.555%;}
#case14 {background: url("../img/achievement/img_case14.jpg") no-repeat 0 0 / 35.555%;}
#case15 {background: url("../img/achievement/img_case15.jpg") no-repeat 0 0 / 35.555%;}
#case16 {background: url("../img/achievement/img_case16.jpg") no-repeat 0 0 / 35.555%;}
#case17 {background: url("../img/achievement/img_case17.jpg") no-repeat 0 0 / 35.555%;}

.case h3 {
  color: #21b2c7;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 18px;
}
.case h4 {
  font-size: 1.6rem;
  font-weight: 700;
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: solid 1px #bababa;
}
.case h4 span {
  display: inline-block;
  padding-right: 1.5rem;
}
.case a {
  text-decoration: underline;
  color: #21b2c7;
}
.case figure {
  margin: 30px auto;
  text-align: center;
}
.case p {
  margin-bottom: 20px;
}
.case .btn02 {
  position: absolute;
  right: 0;
}
.case .readmore {
  padding-bottom: 15px;
}
.case .readmore p {
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .case {
    margin-bottom: 100px;
    padding-left: 0;
    background: none !important;
  }
  .case h4 span {
    display: block;
  }
}

/* ------各種データ------- */
#data th,
#data td {
  padding: 10px;
  text-align: center;
}

/* ------研究紹介------- */

#research .sec02 h3 {
  text-align: center;
  color: #000;
  border-bottom: none;
  margin-bottom: 30px;
}
#research .sec02 .btn01 {
  margin: 0 auto 20px;
}
#research .sec01 ul li span {
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 1.8rem;
  font-weight: 700;
  padding: 12px 20px 12px 15px;
  position: relative;
  transition: .4s ease;
  background: #21b2c7;
}
#research .sec01 ul li span:after {
  position: absolute;
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  right: 20px;
  top: 40%;
  transform: rotate(135deg);
}
#research .sec01 ul li span.open:after {
  transform: rotate(-45deg);
}
#research .sec01 ul li {
  margin-bottom: 25px;
}
#research .sub {
  display: none;
}
#research .sub .table-scroll{
  
}
#research .sub table td ul li {
  margin-bottom: 10px;
}
#research .sub table td ul li:last-child {
  margin-bottom: 0;
}

/* ------報告書------- */
#report table td {
  width: 77.777%;
}
#report table dl dt {
  background: #ebfcff;
  color: #21b2c7;
  padding: 11px 20px;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 20px;
}
#report table td p {
  margin-bottom: 15px;
}
@media screen and (max-width: 640px) {
  #report table {
    border-top: solid 1px #bababa;
  }
  #report table th,
  #report table td {
    display: block;
    width: 100%;
    border-width: 0 1px 1px !important;
  }
}

/* 学内向け
-------------------------------------------------------- */
#receive #side_for-campus,
#application #side_for-campus {
  display: block !important;
}

/* ------研究資料の授受------- */
#receive .sec03 p.marker01 {
  margin-bottom: 18px;
}
#receive .sec03 a.clip {
  display: block;
  margin-bottom: 25px;
}
#receive .sec03 h3 {
  background: #ebfcff;
  color: #21b2c7;
  padding: 11px 20px;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 20px;
  border-bottom: none;
}
#receive .sec03 h4 {
  font-weight: 700;
  font-size: 1.6rem;
  margin-bottom: 18px;
}
#receive .sec03 .indent p {
  margin-bottom: 18px;
  font-size: 1.4rem;
}
#receive .sec03 .indent p.note {
  margin: 25px 0 35px;
}
#receive .sec03 .indent ul {
  
}
#receive .sec03 .indent li {
  margin-bottom: 3px;
}

/* ------発明相談・特許出願------- */

#application .flow > li {
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  width: 80%;
  max-width: 720px;
  padding: 0 0 0 16%;
  position: relative;
}
#application .flow {
  margin-bottom: 60px;
}
#application .flow > li h3 {
  width: 36.6666%;
  max-width: 330px;
  padding: 30px 2% 20px 2%;
}
#application .flow > li .marker01 {
  width: calc(100% - 36.6666%);
  background: #fff;
  border: solid #7dd5e2;
  border-width: 1px 1px 0 1px;
  padding: 20px 2% 20px 5%;
  position: relative;
}
#application .flow > li:last-child .marker01 {
  border-width: 1px 1px 1px 1px;
}
#application .flow > li .marker01 li {
  font-size: 1.4rem;
  font-weight: 500;
}
#application .flow > li:nth-child(3) p.note {
  position: absolute;
  top: 20px;
  right: -145px;
  font-weight: 500;
}
#application .flow > li:nth-child(3) .marker01::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  right: -35px;
  background: url("../img/common/arrow05.png") no-repeat 0 0 / 100%;
  width: 73px;
  height: 49px;
}
#application #columnR h2 {
  margin-bottom: 20px;
}
#application #columnR p {
  margin-bottom: 30px;
}
#application .sec02 h3 {
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  color: #000;
  border-bottom: none;
  margin-bottom: 30px;
}
#application .sec02 .btn01 {
  margin: 0 auto 20px;
}

@media screen and (max-width: 640px) {
  #application .flow > li {
    display: block;
    width: 100%;
    padding: 0 0 10px 18%;
  }
  #application .flow > li h3 {
    width: 100%;
    padding: 23px 2% 10px 2%;
  }
  #application .flow > li .marker01 {
    width: 96%;
    border: solid #7dd5e2 1px !important;
    padding: 10px 2% 10px 5%;
  }
  #application .flow > li:nth-child(3) p.note {
    position: inherit;
    right: 0;
    top: 0;
    margin: 30px 0 0 20px !important;
  }
  #application .flow > li:nth-child(3) .marker01::after {
    left: 60px;
    width: 35px;
    height: 29px;
    top: 90px;
    transform: rotate(90deg);
  }
}

/* サイトマップ
-------------------------------------------------------- */

#pageList {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#pageList > li {
  width: 26.7%;
  margin-bottom: 30px
  /*float: left;
  margin: 0 8.3% 55px 0;*/
}
/*#pageList > li:nth-child(3),
#pageList > li:nth-child(6) {
  margin: 0 0 55px 0 !important;
}*/
#pageList li span {
  border-bottom: solid 1px #21b2c7;
  display: block;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 20px;
  padding-bottom: 10px;
}
#pageList li ul li {
  font-size: 1.6rem;
  padding-left: 8%;
  position: relative;
  margin-bottom: 25px;
}
#pageList li ul li::before {
  content: "●";
  color: #21b2c7;
  font-size: 0.9rem;
  position: absolute;
  left: 0;
  top: 6px;
}
#pageList li ul li a {
  text-decoration: underline;
  color: #21b2c7;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
    #pageList > li {
    width: 46%;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 640px) {
    #pageList > li {
    width: 100%;
    margin-bottom: 15px;
  }
}