@charset "utf-8";
/*
Theme Name: 多元応答ゲノム
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Template: lightning
Description: ★ テーマの説明（空欄でも可） ★
Author: ★ テーマ作成者の名前（空欄でも可） ★
Tags: 
Version: 0.1.2
*/
/*ヘッダー共通*/

/*{
    transition : .3s;
}*/


h2 {
    border: none;
    padding: 0;
    font-size: 29px;
    line-height: 100%;
}
h2 .sub {
    font-size: 16px;
}
.color-blue {
color: #27a9b3;
}


.site-header-logo img {
    max-height: none;
}

.datebase a, .datebase-en a {
	display:block;
	float:right;
	background:#27A9B3;
	padding:5px 10px;
	text-align: center;
	color:#fff;
	margin-top:48px;
    font-size: 14px;
	
}



.datebase a:hover {
	opacity:.8;
}
.global-nav-list>li {
    width: 100%;
    border-left: 1px solid #333;
}
.global-nav-list>li:last-child {
    border-right: 1px solid #333;
}
.site-header {
    box-shadow: none;
}
#global-nav li:hover,
li.current-menu-item, li.current-page-ancestor {
    background:#f5f5f5;
}

.global-nav-list .sub-menu li.current-menu-item {
    background:#2ab9c4;
}

body:not(.header_scrolled) .global-nav--layout--float-right {
    margin-bottom: 20px;
}
.global-nav-list>li:hover:before, .global-nav-list>li[class*=current]:before {
    width: 0;
}




body.page-id-340 .global-nav--layout--float-right,
 .page-header-inner h1, 
 .page-id-340 .site-header-logo {
	display:none!important;
}

.site-header-logo.en {
	display:none;
}
.page-id-340 .site-header-logo.en {
	display:block!important;
}

/* --------------------------- */
.copy-en {
	display:none;
}

.page-id-340 .site-footer-copyright span {
	display:none;
}

.page-id-340 .site-footer-copyright .copy-en {
	display:block;
}

/* --------------------------- */
.footer-widget-3,.footer-widget-4 {
	display:none;
}

.page-id-340 .footer-widget-1,
.page-id-340 .footer-widget-2 {
	display:none;
}

.page-id-340 .footer-widget-3,
.page-id-340 .footer-widget-4 {
	display:block;
}




/* --------------------------- */
.datebase-en {
	display:none;
}

.page-id-340 .datebase {
	display:none;
}

.page-id-340 .datebase-en {
	display:block;
}


/*----------------------------*/
.global-nav-list>li>ul.sub-menu {
    margin-top: 30px;
}

body.achievement .siteContent li {
    margin-bottom: 0px;
    padding-bottom: 10px;
}


.device-pc .global-nav-list>li>a {
    padding: 10px 1.5em;
}

.device-pc .global-nav-list>li.menu-item-has-children:hover::after, .global-nav-list>li.acc-parent-open::after {
    opacity: 1;
    bottom: -10px;
}

/*----------------------------*/

body {
 font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
 color:#505050;  
}

@media (max-width:768px) {
	.datebase a, .datebase-en a {
    margin-top: 10px;
    margin-bottom: 10px;
}
}


.newsticker {
    padding: 0;
    list-style: none;
}


.newsContent {
    padding: 50px 0 50px;
}


.newsContent h2 {
    display: inline-block;
    width: 150px;
    vertical-align: middle;
    margin-bottom: 0;
    padding-left: 30px;
}
.newsContent .newsticker {
    width: calc(100% - 280px);
    display: inline-block;
    vertical-align: middle;
    border-left: 1px solid #333;
    padding-left: 30px;
}
.newsticker li{
    margin-bottom:10px;
}
.news_ymd {
    margin-right: 20px;
    vertical-align: top;    
}
.news_cat {
    color: #aa82ce;
    border: 1px solid #aa82ce;
    font-size: 15px;
    padding: 0 17px 0;
    margin-right: 20px;
    vertical-align: top;    
}
.news_cat.info {
    color: #0077c3;
    border: 1px solid #0077c3;
}
.news_cat.report {
    color: #00c0b1;
    border: 1px solid #00c0b1;
}

.news_title {
    display:inline-block;
   width : 80% ;
   width : -webkit-calc(100% - 240px) ;
   width : calc(100% - 240px) ;
    vertical-align: top;
}





.newsContent .more-btn {
    margin-top: -40px;
}

.btn-readmore {
    cursor: pointer;
    color: #27acc2;
    border: 1px solid #27acc2;
    border-radius: 0px;
	margin-top: 20px;
    float: right;
}








.aboutContent {
    background: url(images/top-about-bg.jpg) no-repeat center center;
    background-size: cover;
    padding: 50px 0 20px;
}

.aboutContent h2 {
    display: inline-block;
    width: 200px;
    vertical-align: top;
    margin-top: 60px;
    padding-left: 30px;
}
.aboutContent .about-text {
    width: calc(100% - 330px);
    display: inline-block;
    /* vertical-align: middle; */
    max-width: 496px;
}


.item-group-title {
font-size: 18px;
    color: #27a9b3;
    text-align: center;
    font-weight: bold;
}

.group-col-01 {
    background: url("images/top_group_a01.JPG") no-repeat top center;
}
.group-col-02 {
    background: url(images/top_group_a02.png) no-repeat top center;
}
.group-col-03 {
    background: url(images/top_group_a03.png) no-repeat top center;
}

.group-col-item {
    padding: 0 25px 0;
    background-size: 100%;
}

.group-col-item .wp-block-group {
    background: rgba(255,255,255,0.8);
    margin: 180px 0 0;
    padding: 20px 24px 25px;
    box-shadow: 3px 4px 26px #aaa;
	min-height:476px;
}
.item-group-title.item-01 {
    margin-bottom: 5px;
}

.item-group-title.item-02 {
}

.item-group-txt {
font-size: 15px;
}


.site-footer {
    background: #27a9b3;
    border-top: none;
    color: #fff;
    font-size: 14px;
}

.site-footer a{
    color:#fff;
}



.more-btn {
    text-align: right;
}

.more-btn a {
    background: url(images/more-btn-w.png) no-repeat right 12px center #27a9b3;
    color: #fff;
    font-weight: normal;
    padding: 4px 30px 4px 14px;
    text-decoration: none;
}

.about-text .more-btn a {
    background: url(images/more-btn-k.png) no-repeat right 12px center;
    color: #505050;
    font-weight: normal;
    padding: 0 30px 0 0;
}


.site-footer-copyright {
    text-align: center;
    font-size: 12px;
}
.banner-block {

}

.footer-widget-2 p {
    float: right;
}







/*下層ページ*/

.page-header {
    background:url(images/page_header.png) no-repeat;
	background-size: cover;
}
.organization .page-header,.organization-child .page-header{
    background:url(images/page_header_organization.jpg) no-repeat;
}






.page-header-title, h1.page-header-title {
    text-shadow:0 0 5px #134551;
	font-weight:normal;
}

.page h3 {
	font-size:28px;
	color:#27A9B3;
	border:none;
	text-align:center;
	font-weight:normal;
	line-height:1.2;
}
.page h3:after{
	display:none;
}
.page h3 small {
	display:block;
	font-size:14px;
}


.wp-block-group:nth-child(even) {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	background:#EBFFFF;
	margin-top:90px;
	padding-bottom:76px;
	padding-top:64px;
}
.wp-block-group__inner-container {
	max-width:1010px;
	margin:0 auto;
}
@media (min-width: 1200px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1040px;
}
body:not(.header_scrolled) .global-nav--layout--float-right {
    width: 100%;
    display: block;
}


}





@media (min-width: 992px){
.site-header--layout--nav-float .site-header-container {
    display: block;
}
.device-pc .global-nav-list>li>a {
    padding: 13px 1.5em;
}

}




/* 領域概要/挨拶　*/

.about figure {
	display:inline-block;
}

.about p.greet_text {
	    display: inline-block;
    width: 100%;
/*    margin-left: 34px;*/
	vertical-align:top;
}

.about .greet_name {
	font-size:18px;
}

.about figcaption {
	text-align:left;
}


@media (max-width:768px) {
	.about figure {
		display:block;
		text-align:center;
	}
	.about p.greet_text {
		display:block;
		width:100%;
		margin-left:0;
	}
	.wp-block-image img {
    width: 100%;
}
.wp-block-group:nth-child(even) {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	padding:30px;
	margin-top:60px;
}
}


/* 研究組織　*/



.title {
    margin: 20px auto 20px;
    padding: 1px;
    background: #ebffff;
    border-bottom: solid 1px #27a9b3;
	color: #27a9b3;
	text-align: center;
}

.title h3 {
    padding: 35px 30px 0px;
}

.photo-block ul {
    display: inline-block;
    width: 100%;
}

.photo-block ul li {
    width: 33.3%;
	float: left;
}

.photo-item {
    padding: 20px 10px;
	display: flex;
    align-items: flex-end;
}


.photo-item-img {
	width: 150px;
	margin-right: 15px;
}

.photo-item-img img {
	border: 1px solid #ccc;
	height: 160px;
}



.photo-item-text {
	color:#555;
}

span.name {
    font-size: 18px;
    margin-right: 10px;
    line-height: 140%;
}

span.job {
	font-size: 15px;
}

.photo-box {
    padding: 0 15px;
	margin-top: -24px;
}
.photo-content {
    background: #fff;
    display: inline-block;
    padding: 55px 25px 20px;
    position: relative;
    box-shadow: 0px 1px 18px #aaa;
}
.photo-data {
    background: #563779;
    color: #fff;
    font-size: 18px;
    display: inline-block;
    padding: 7px 20px;
    position: absolute;
    left: 0;
	top: 0;
}
.photo-title {
    font-size: 18px;
    line-height: 24px;
}
.photo-txt {
    font-size: 15px;
    line-height: 21px;
	margin-bottom: 0;
}
.content-scroll {
    overflow-y: auto;
    height: 130px;
}


.photo-listbtn {
    clear: both;
    display: table;
    margin: 30px auto;
    background: #563779;
}

.photo-listbtn a {
    padding: 14px 94px 14px 86px;
    background: url(images/btn-bg.png) no-repeat center right 21px;
    color: #fff;
    font-size: 18px;
    display: block;
}

.page.organization h3,
.page.organization-child h3{
    font-size:1.2em;
    font-weight: bold;
    padding:15px;
    margin-bottom:0;
    position: relative;
}
.page.organization h3::after{
    content: url(images/h3arrow.png);
    position:absolute;
    bottom:-10px;
}



.page.organization ul,
.page.organization-child ul{
    list-style: none;
}

.page.organization .photo-item-text,
.page.organization-child .photo-item-text{
    font-size:12px;
}

.btn-readmore a {
    color:#27acc2;
}

@media (max-width:992px){
    .photo-item{
        display: block;
    }
}
@media (max-width:600px) {
    .photo-block ul li {
    width: 100%;
	    }
}
@media (max-width:300px) {
    .photo-block ul li {
    width: 100%;
	float: none;
    }
}




/*--各研究班紹介--*/
.Intro {
    text-align: justify;
}

figure {
    width: 80%;
    margin: 0 auto;
}

.intro-item-title:before {
    content: "■";
    color: #27a9b3;
    margin-right: 5px;
}



.intro-item {
    display: flex;
	text-align: justify;
}

.intro-item-img {
    margin-right: 20px;
	width: 35%;
    padding: 0px 30px 0px 20px;
}

.intro-item-img img {
    max-width: none;
    width: 240px;
    border: 1px solid #ccc;
}

.intro-item-text {
	width: 65%;
	margin-top: 20px;
}

ul.intro {
    width: 1020px;
    margin-left: -40px;
}

ul.intro li:nth-child(odd) {
    background: #ebffff;
}

ul.intro li {
    padding: 30px 80px 50px;
}


span.reseach-map {
    margin: 20px;
    margin-right: 0;
}

span.reseach-map a {
    color: #fff;
	display: inline-block;
    text-decoration: none;
    padding: 6px 15px 4px;
    background-color: #27a9b3;
}

span.reseach-map a:before {
    content: url(https://trais-out4.sakura.ne.jp/dir-gb_fiber/wp-content/uploads/2021/11/reseach.png);
    margin-right: 5px;
}
span.reseach-map a:hover{
    background:#36c6d1;
}

.intro-item-text-top,
.intro-item-text-bottom{
    border-bottom: 1px solid #27a9b3;
}

.intro-item-text-top p {
    font-size: 12px;
	line-height: 2;
}

.intro-item-text-bottom {
    font-size: 12px;
	line-height: 2;
	padding-top: 15px;
    padding-bottom: 30px;
    text-align: left;
}


@media (max-width:992px) {
	.intro-item {
    display: block;
	text-align: justify;
}
	
	ul.intro {
	width: auto;
/*    max-width: 720px;*/
}
	
	.intro-item-img {
     margin-right: 0px; 
     width: auto; 
     padding: 0px; 
     margin: 0 auto;
}
	.intro-item-text {
     width: auto; 
     margin-top: 20px;
}
	ul.intro li {
    padding: 20px 15px 30px;
}
	
	.intro-item-img img {
    width: 200px;
}
}

@media (max-width:420px) {
	.intro-item {
    display: block;
	text-align: center;
}
	

	
}


@media (max-width:420px) {
span.reseach-map {
    margin-left: 15px;
    margin-top: 5px;
    margin-bottom: 5px;
}
	.intro-item-text-top p {
    font-size: 12px;
     line-height: none; 
}
	
}

span.fn {
    display: none;
}
.entry-meta-item-author-image {
    display: none;
    position: relative;
    top: 0.2em;
    margin-right: 0.4em;
    width: 1.4em;
    border-radius: 50%;
    overflow: hidden;
    /* display: inline-block; */
}
span.updated {
    display: none;
}
i.fas.fa-history {
    display: none;
}

.vk_post .media-img {
    width: 35%;
    display: none;
}

/*-------------各個別ページへのリンク---------------*/
.link-boxes {
    display: flex;
    justify-content: space-evenly;
    margin: 60px auto 0px;
}
.link-btn a {
    display: inline-block;
    background-color: #27a9b3;
    color: #fff;
    padding: 10px 45px;
    margin: 0px 20px;
    max-width: 174px;
    text-align: center;
    width: 100%;
    min-width: 174px;
}
.link-btn a:hover {
    color: #fff;
    background-color: #27a9b3a1;
}

/*---------------各班ページのメニューホバー------------------*/
.global-nav-list>li.menu-item-has-children::after {
    transition: all .2s ease-out;
    content: "";
    position: absolute;
    padding: 0;
    bottom: -10px;
    left: 50%;
    top: 10px;
    transform: translateX(-50%);
    border: 10px solid transparent;
    z-index: 1000;
    opacity: 0;
    border-bottom-color: var(--vk-color-primary);
}
.global-nav-list>li>ul.sub-menu {
    margin-top: 10px;
}



/*研究成果*/


body.achievement ul{
    list-style:none;
}
body.achievement .siteContent li {
    border-bottom:1px solid #ccc;
}









.category-report h5{
    border-bottom:none;
}

.move .container {
    pointer-events: none;
    margin: 0 auto;
    position: relative;
    width: 100%;
    padding-top: 637px;
    margin-bottom: 0px;
    overflow: hidden;
    max-height: 555px!important;
}
.pattern {
    width: 100%;
    height: 100%;
    background: url(images/pattern-01.png);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    background-size: auto auto, cover;
}
.move iframe {
    position: absolute;
    top: -40px;
    left: 0;
    width: 100% !important;
    height: 112.5% !important;
    border: none;
    transform: scale(1.09);
}



.jaen_button {
	text-align:right;
	margin-top:10px;
}

.jaen_button .ja {
	font-weight:bold;
	color:#27A9B3;
}
.page-id-340 .jaen_button .en {
	font-weight:bold;
	color:#27A9B3;
}

.page-id-340 .jaen_button .ja {
	font-weight:normal;
	color:#666666;
}


.greet_photo {
    display: inline-block;
    width: 260px;
    vertical-align: top;
}
.greet_text_box {
    width: calc(100% - 270px);
    display: inline-block;
    margin-bottom: 30px;
}


.topics-content {
    padding: 60px 0 20px;
}

.topics-block {
    border: 2px solid #27a9b3;
    padding: 20px 30px 10px;
}
.topics-block h2 {
    margin-bottom: 20px;
}
.block-title {
    text-align: center;
    border-bottom: 1px solid #27a9b3;
    padding: 0 0 10px;
    margin-bottom: 25px;
}
.topics-block p {
    margin-bottom: 20px;
}


@media (max-width:1199px) {

.move .container {
    padding-top: 567px;
}

}

@media (max-width:991px) {
.move .container {
    padding-top: 435px;
}
.move iframe {
    height: 117.5% !important;
}

.news_title {
    display: block;
    width: 100%;
    margin: 10px 0 20px;
}
.newsContent .newsticker {
    width: calc(100% - 160px);
}

.newsContent .more-btn {
    margin-top: 0;
}
.datebase-en a {
    margin-top: 10px;
    margin-bottom: 10px;
}


}


@media (max-width:767px) {
.move .container {
    padding-top: 330px;
}
.move iframe {
    height: 123.5% !important;
}

.aboutContent .about-text {
    width: calc(100% - 210px);
}
.greet_text_box {
    width: 100%;
}
.greet_photo {
    margin-bottom: 20px;
    margin: 0 auto 20px;
display: table;
}
.greet_photo figure {
    width: 100%;
}


}



@media (max-width:600px) {


.group-col-item .wp-block-group {
    background: rgba(255,255,255,0.8);
    margin: 180px 0 0;
    padding: 20px 24px 25px;
    box-shadow: 3px 4px 26px #aaa;
    min-height: auto;
}
.group-col-item {
    margin-bottom: 50px;
}

}












@media (max-width:575px) {
.move .container {
    padding-top: 60%;
}
.move iframe {
    height: 125.5% !important;
}

.newsContent .newsticker {
    width: 100%;
    border-left: none;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 20px;
    border-top: 1px solid #333;
}

.topics-content {
    margin: 0 15px 0;
}
.topics-block {
    padding: 30px 20px 20px;
}


}

@media (max-width:500px) {
.move .container {
    padding-top: 56%;
}
.move iframe {
    height: 128.5% !important;
}
.aboutContent .about-text {
    width: 100%;
}

.site-footer .footer-widget-1,
.site-footer .footer-widget-2,
.site-footer .footer-widget-3,
.site-footer .footer-widget-4 {
flex: auto;
    max-width: 100%;
}

.site-body {
    padding: 2rem 0px 2rem;
}
.page h3 {
    font-size: 22px;
}

.title h3 {
    padding: 35px 20px 0px;
}






















}

@media (max-width:400px) {
.move iframe {
    height: 135.5% !important;
}
.link-boxes {
    display: block;
}
.link-btn a {
    display: table;
    margin: 0 auto 10px;
}






}




.block-none {
    display: none;
}