/*------------------------------------------------------ page-title ------------------------------------------------------*/ #page-title { background: url(/cooperation/images/st_pagetitle.jpg) no-repeat center center; background-size: cover;} @media (min-width: 768px) { } @media (max-width: 767px) { } @media (max-width: 480px) { #index #page-title { background: url(/cooperation/images/st_pagetitle_sp.jpg) no-repeat center center; background-size: cover; } } /*------------------------------------------------------ ¹²Í¨ ------------------------------------------------------*/ /* .l_col-pagenav { padding: 10px 0 3px; border-bottom: 1px solid #D7E1E7; margin-bottom: 0; } .l_col-pagenav li { color: #3096B7; font-weight: bold; font-size: 1.4rem; } .l_col-pagenav li a { transition: all 0.2s; color: #5C2E7E; text-decoration: none; position: relative; padding-right: 12px; } .l_col-pagenav li a::before { content: ''; transition: all 0.2s; position: absolute; top: 50%; right: 0; border-top: 2px solid #5C2E7E; border-right: 2px solid #5C2E7E; width: 6px; height: 6px; transform: translateY(-50%) rotate(45deg); } */ .l_col-dl {} .l_col-dl dt { background: #D7E1E7; width: 100%; } .l_col-dl dd { background: #F0F5F8; margin: 0; } .l_col-dl dd .text { margin-bottom: 20px; } .l_col-dl dd .text:last-of-type { margin-bottom: 0; } .l_col-dl .list-a { margin: 0; } .l_col-dl.arrow { position: relative; } .l_col-dl.arrow::before { content: ''; position: absolute; bottom: -35px; right: 0; left: 0; margin: 0 auto; border-top: 13px solid #5C2E7E; border-right: 13px solid #5C2E7E; border-left: 13px solid transparent; border-bottom: 13px solid transparent; width: 25px; height: 25px; transform: rotate(135deg); } .l_col-dl.arrow:not(:last-of-type) { margin-bottom: 60px; } @media (min-width: 768px) { /* .l_col-pagenav { -webkit-box-pack: start; justify-content: flex-start; } .l_col-pagenav li {} .l_col-pagenav li:not(:last-of-type) { margin-right: 30px; } .l_col-pagenav li a:hover { color: #3096B7; } .l_col-pagenav li a:hover::before { border-color: #3096B7; } */ .l_col-dl {} .l_col-dl dt, .l_col-dl dd { padding: 20px 30px; } .l_col-dl dt { max-width: 360px; } .l_col-dl dd { width: calc(100% - 360px); } } @media (max-width: 767px) { /* .l_col-pagenav { display: block; } .l_col-pagenav li { margin-bottom: 0; } */ .l_col-dl { display: block; } .l_col-dl dt { margin-bottom: 0; padding: 20px 30px 5px; } .l_col-dl dd { padding: 20px 10px; } } /*------------------------------------------------------ [index] ------------------------------------------------------*/ #index .l_col-2 .btn-a a { max-width: 100%; } @media screen and (min-width:768px) and ( max-width:1220px) { #index #main-visual .title { font-size: 6vw; } } /*------------------------------------------------------ [community] index ------------------------------------------------------*/ #community #about {} #community #about .link {} #community #facility-use {} #community #facility-use .list-a { margin-top: 0;} @media (min-width: 768px) { #community #about .link { padding: 60px 0;} } @media (max-width: 767px) { #community #about .title-f { margin-bottom: 20px; } #community #about .link { padding: 30px 0;} } /*------------------------------------------------------ [community] program ------------------------------------------------------*/ #community-program .list-a { margin: 0; } @media (min-width: 768px) { #community-program #program-1 .list-a { margin-bottom: 70px; } #community-program #program-3 figure { margin-bottom: 0; } } @media (max-width: 767px) { #community-program #program-1 .list-a { margin-bottom: 30px; } } /*------------------------------------------------------ [community] project ------------------------------------------------------*/ #community-project #project-3 .text { margin-bottom: 40px; } @media (min-width: 768px) { } @media (max-width: 767px) { #community-project #project-1 .l_col-2-l .text { margin-bottom: 0; } } /*------------------------------------------------------ [community] activity ------------------------------------------------------*/ #community-activity #activity-1 {} #community-activity #activity-1 > .l_col-2 > div { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } #community-activity #activity-1 > .l_col-2 > div .text { -webkit-box-flex: 1; flex-grow: 1; } @media (min-width: 768px) { #community-activity #activity-2 > div > .text { margin-bottom: 40px; } #community-activity #activity-4 > .text { margin-bottom: 40px; } #community-activity #activity-4 .l_col-3 { margin-bottom: 40px; } } @media (max-width: 767px) { #community-activity #activity-2 > div > .text { margin-bottom: 20px; } #community-activity #activity-4 > .text { margin-bottom: 20px; } #community-activity #activity-4 .l_col-3 { margin-bottom: 20px; } } /*------------------------------------------------------ [community] report ------------------------------------------------------*/ #community-report #activity-report > .l_col-2-l figure { margin-bottom: 0; } @media (min-width: 768px) { #community-report #activity-report > .l_col-2-l .text { margin-bottom: 0; } #community-report #activity-report > .l_col-2-l { margin-bottom: 80px; } } @media (max-width: 767px) { #community-report #activity-report > .l_col-2-l { margin-bottom: 40px; } } /*------------------------------------------------------ [coc] index ------------------------------------------------------*/ #coc #about > .l_col-2 { margin-bottom: 50px; } @media (min-width: 768px) { #coc #about > .l_col-2 .text { margin-bottom: 0; } #coc #about #news { margin-bottom: 140px; } #coc #about .link { padding: 60px 0; } #coc #about .link hr { margin: 50px 0; } /* #coc #about .link .l_col-btn-index li:first-of-type > a { font-size: 1.6rem; line-height: 1.4; } */ } @media (max-width: 767px) { #coc #about .title-f { margin-bottom: 20px; } #coc #about .link { padding: 30px 0; } #coc #about .bnr-wrap > *:first-child { margin-bottom: 20px; } } /*------------------------------------------------------ [coc] outline ------------------------------------------------------*/ #coc-outline #outline-2 ul { list-style: none; counter-reset: number 0; } #coc-outline #outline-2 ul li h3::before { counter-increment: number 1; content: counter(number, upper-roman) ". "; } #coc-outline #vision-1 figcaption { text-align: left; font-size: 1.4rem; } @media (min-width: 768px) { #coc-outline #outline-2 ul li:nth-of-type(-n+2) { margin-bottom: 25px;} } @media (max-width: 767px) { } /*------------------------------------------------------ [coc] program ------------------------------------------------------*/ #coc-program #about figure { margin-bottom: 0; } #coc-program #program-2 figure { max-width: 960px; } @media (min-width: 768px) { #coc-program #program-2 .list-a { margin-top: 20px; margin-bottom: 20px; } } @media (max-width: 767px) { #coc-program #program-2 .list-a { margin-top: 20px; margin-bottom: 20px; } } /*------------------------------------------------------ [coc] curriculum ------------------------------------------------------*/ #coc-curriculum .table-wrap { overflow-x: auto; } #coc-curriculum .table-a { margin-bottom: 0; min-width: 900px; } #coc-curriculum .table-a tbody th, #coc-curriculum .table-a tbody td { text-align: left; } #coc-curriculum .table-a th, #coc-curriculum .table-a td { vertical-align: middle; } #coc-curriculum .table-a thead th { padding: 0; } #coc-curriculum .table-a tbody th { padding: 25px; } #coc-curriculum .table-a td { background: #fff; padding: 20px; } #coc-curriculum .table-a tbody tr:not(:last-of-type) td:nth-of-type(n+2) { text-align: center; } #coc-curriculum .table-a .vertical { writing-mode: vertical-rl; letter-spacing: 0.7em; text-align: center; } #coc-curriculum .table-a .col1 { width: 23.28%; } #coc-curriculum .table-a .col2 { width: 6.9%; } #coc-curriculum .table-a .col3 { width: 19.83%; } /* #coc-curriculum .presentation ul li { font-size: 1.8rem; } */ #coc-curriculum .presentation ul li span { margin-left: 20px; font-size: 1.6rem; } @media (min-width: 768px) { } @media (max-width: 767px) { } /*------------------------------------------------------ [coc] report ------------------------------------------------------*/ #coc-report {} .post-list {} .post-list li {} .post-list li a { transition: all 0.2s; display: block; background: #F0F5F8; border-bottom: 1px solid #D7E1E7; text-decoration: none; color: inherit; padding: 20px 20px 30px; } .post-list li:first-of-type a { border-top: 1px solid #D7E1E7; } .post-list li a .title-c { margin-bottom: 0; } .post-list li a .date { color: #5C2E7E; font-weight: bold; letter-spacing: 0; } .post-list li a:hover { background: #F0EAF5; } @media (min-width: 768px) { .post-list li a .date { font-size: 1.8rem; } .post-list li a .title-c {} } @media (max-width: 767px) { .post-list li a .date { font-size: 1.6rem; } .post-list li a .title-c { font-size: 1.8rem; } } /*------------------------------------------------------ [coc] report-single ------------------------------------------------------*/ #coc-report-single .l_col-coc-report-single .main-contents { } #coc-report-single .l_col-coc-report-single .side-nav { } #coc-report-single .category a { color: #5C2E7E; } #coc-report-single .title-d-wrap { background: #D7E1E7; padding: 10px; margin-bottom: 20px; } #coc-report-single .title-d-wrap p { margin-bottom: 0px; } #coc-report-single .new-arrivals-list ul li p { font-size: 1.4rem; } #coc-report-single .new-arrivals-list a { text-decoration: none; } #coc-report-single .new-arrivals-list ul li { border-bottom: 1px solid #D7E1E7; margin-bottom: 20px; } #coc-report-single .new-arrivals-list .title { color: #333; font-size: 1.4rem; } #coc-report-single .new-arrivals-list .title:hover { text-decoration: underline; } #coc-report-single .main-contents .info { } #coc-report-single .main-contents .info > div { display: inline-block; width: auto; margin-right: 20px; min-width: 100px;} #coc-report-single .tag { font-size: 1.6rem; font-weight: bold; color: #5C2E7E; text-align: center; width: 100px; border: 1px solid #5C2E7E; background: #fff; } #coc-report-single .title-post { font-size: 2.8rem; color: #5C2E7E; font-weight: bold; padding-bottom: 30px; border-bottom: 1px solid #D0D9E3; margin-bottom: 15px; line-height: 140%;} #coc-report-single .date { font-size: 1.6rem; color: #5C2E7E; font-weight: bold; margin-bottom: 0px;} #coc-report-single .attached { padding: 10px;} #coc-report-single .attached .filelist { font-size: 1.6rem;} #coc-report-single .attached .filelist:not(:last-child) { margin-bottom: 10px;} #coc-report-single .attached .filelist img { vertical-align: sub;} #coc-report-single .attached .filelist a { text-decoration: underline; } #coc-report-single .attached .filelist a:hover { text-decoration: none; } @media (min-width: 768px) { #coc-report-single .l_col-coc-report-single .main-contents { max-width: 860px; width: 75%; } #coc-report-single .l_col-coc-report-single .side-nav { max-width: 260px; width: 23%; } } @media (max-width: 767px) { #coc-report-single .l_col-coc-report-single .main-contents { width: 100%; } #coc-report-single .l_col-coc-report-single .side-nav { width: 100%; } #coc-report-single .main-contents { margin-bottom: 50px; } } /*------------------------------------------------------ [coc] vision ------------------------------------------------------*/ #coc-vision .title-f { color: inherit; } #coc-vision #vision-1 { } #coc-vision #vision-1 .single.w960 { max-width: 960px; } #coc-vision #vision-1 .single figcaption { text-align: left; color: inherit; margin: 0; } #coc-vision #vision-2 .l_col-2-l .text {} #coc-vision #vision-2 .l_col-2-l figure { max-width: 260px; margin-bottom: 0; } @media (min-width: 768px) { #coc-vision #vision-1 .l_col-2 { margin-bottom: 20px; } #coc-vision #vision-2 .l_col-2-l .text { width: calc(100% - 260px - 50px); } #coc-vision #vision-2 .l_col-2-l figure {} } @media (max-width: 767px) { #coc-vision #vision-1 .l_col-2 {} #coc-vision #vision-2 .l_col-2-l .text .list-a { margin-bottom: 0; } #coc-vision #vision-2 .l_col-2-l figure { margin: 0 auto; } } /*------------------------------------------------------ [coc] adult ------------------------------------------------------*/ #coc-adult .table-b { width: 100%; } #coc-adult .table-b thead th { background: #D7E1E7; } #coc-adult .table-b.subject tbody th { width: 30%; } @media (min-width: 768px) { #coc-adult .table-b tbody th { width: 10%; } } @media (max-width: 767px) { #coc-adult .table-b tbody th { width: 20%; } } /*------------------------------------------------------ [contribution] index ------------------------------------------------------*/ #contribution #about .title-f { color: inherit; } #contribution #main-contribution .list-a { margin-bottom: 0; } #contribution #main-contribution figure { margin-bottom: 0; } @media (min-width: 768px) { #contribution #about { margin-bottom: 40px; } #contribution #about .title-f { margin-bottom: 0; } } @media (max-width: 767px) { #contribution #about {} #contribution #about .title-f { margin-bottom: 20px; } } /*------------------------------------------------------ [coc] index ------------------------------------------------------*/ #cll #cll-4 ul:first-of-type { margin-top: 0; } #cll #cll-5 ul { margin-top: 0; } #cll #cll-6 .btn-c a { margin-left: auto; margin-right: auto; } #cll .l_col-guidebook .title a{ text-decoration: none; } @media (min-width: 768px) { #cll .l_col-guidebook .title a:hover { text-decoration: underline; } } @media (max-width: 767px) { #cll .title-f { margin-bottom: 20px; } } /*------------------------------------------------------ [cll] archive ------------------------------------------------------*/ .activity-slider { margin: 0 calc(50% - 50vw); width: 100vw; } .activity-slider li { /*border: 1px solid #D7E1E7;*/ max-width: 360px; margin-right: 20px; margin-left: 20px; position: relative; } .activity-slider li a { text-decoration: none; color: inherit; padding: 20px 20px 40px; display: block; height: 100%; background-color: #F0F5F8; } .activity-slider li .img { max-width: 320px; margin-bottom: 20px; } .activity-slider li .img img { width: 100%;} .activity-slider li .text { font-size: 1.4rem; } .activity-slider li .btn-e { position: absolute; bottom: 20px; left: 20px; background: #5C2E7E; color: #fff; font-weight: bold; font-size: 1.4rem; letter-spacing: 0.05em; width: 75px; height: 24px; line-height: 20px; padding-left: 10px; border: 1px solid #5C2E7E; } .activity-slider li .btn-e::before { content: ''; position: absolute; top: 50%; right: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; width: 6px; height: 6px; transform: translateY(-50%) rotate(45deg); } .activity-slider .slick-track { display: flex;} .activity-slider .slick-slide { height: auto !important;} #cll-archive #cll-archive-1 .list-a { display: -webkit-box; display: flex; flex-wrap: wrap; } #cll-archive #cll-archive-1 .list-a li { margin-bottom: 10px; min-width: 145px; } #cll-archive #cll-archive-1 .list-a li a { color: inherit; text-decoration: none; } #cll-archive #cll-archive-1 .list-a li a:hover { text-decoration: underline; } #cll-archive #cll-archive-1 .list-a li.active a { pointer-events: none; color: #3096B7;} #cll-archive #cll-archive-2 .single.w960 { max-width: 800px; } @media (min-width: 768px) { .activity-slider li a { transition: background-color 0.2s; } .activity-slider li a:hover { background-color: #F0EAF5;} .activity-slider li a:hover img { opacity: 1;} .activity-slider li a .btn-e { transition: background-color 0.2s,color 0.2s;} .activity-slider li a:hover .btn-e { background-color: #F0EAF5; color: #5C2E7E; } .activity-slider li a:hover .btn-e::before { border-color: #5C2E7E; } } @media (max-width: 767px) { } /*------------------------------------------------------ [cll] single ------------------------------------------------------*/ #cll-single #single hr { margin-top: 0; margin-bottom: 5px; } #cll-single #single .date { line-height: 1.8; text-align: right; font-weight: bold; letter-spacing: 0; } #cll-single #single .table-a td { text-align: left; } #cll-single #single .btn-c a { margin: 0 auto; } #cll-single #single .attached { padding: 10px;} #cll-single #single .attached .filelist { font-size: 1.6rem;} #cll-single #single .attached .filelist:not(:last-child) { margin-bottom: 10px;} #cll-single #single .attached .filelist img { vertical-align: sub;} #cll-single #single .attached .filelist a { text-decoration: underline; } #cll-single #single .attached .filelist a:hover { text-decoration: none; } @media (min-width: 768px) { #cll-single #single .date { font-size: 1.6rem; margin-bottom: 45px; } #cll-single #single .date + .l_col-2 { margin-bottom: 100px; } #cll-single #single .date + .l_col-2 figure { margin-bottom: 0; } #cll-single #single .table-a td { padding-left: 50px; } #cll-single #single .text { margin-bottom: 75px; } } @media (max-width: 767px) { #cll-single #single .date { font-size: 1.4rem; margin-bottom: 10px; } #cll-single #single .table-a th { width: 130px; } #cll-single #single .table-a td { padding-left: 10px; padding-right: 10px; } #cll-single #single .text { margin-bottom: 30px; } } /*------------------------------------------------------ ------------------------------------------------------*/ @media (min-width: 768px) { } @media (max-width: 767px) { #renkeikyoutei {} #renkeikyoutei #renkeikyoutei-1 .table-b td { display: list-item; width: 100%; list-style-type: none; } } /*------------------------------------------------------ modal ------------------------------------------------------*/ .modal { position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.2); opacity: 0; visibility: hidden; transition: opacity 0.2s ease; display: flex; } .modal.active { align-items: center; justify-content: center; opacity: 1; visibility: visible; } .modal-content { background-color: #fff; margin: 15% auto; padding: 30px; width: 80%; max-width: 900px; position: relative; box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.15); } .modal .close { font-size: 3rem; cursor: pointer; position: absolute; right: 10px; top: 5px; width: 30px; height: 30px; text-align: center; line-height: 30px; } #social-collaboration-examples {} #social-collaboration-examples .list-a {} #social-collaboration-examples .list-a li { border-bottom: 1px solid #D7E1E7; color: #5C2E7E; font-size: 16px; font-weight: 700;} .modal-content > div { width: 100%;} #researcher-title { margin-bottom: 15px;} .modal-content .text {} .modal-content .text p {} #researcher-list { justify-content: flex-start;} #researcher-list li { border-radius: 8px; border: 1px solid #D7E1E7; background: #FFF; text-align: center; font-weight: 700; letter-spacing: 0.05em; overflow: hidden; margin-bottom: 10px } #researcher-list li a { display: block; height: 40px; line-height: 40px; color: #5C2E7E; text-decoration: none;} @media (min-width: 1101px) { #researcher-list li { width: calc(20% - 10px); margin-right: 10px; margin-bottom: 10px; font-size: 1.8rem;} #researcher-list li:hover { background-color: #5C2E7E; border-color: #5C2E7E; transition: background-color 0.2s,border-color 0.2s;} #researcher-list li:hover a { color: #fff; transition: color 0.2s;} } @media (min-width: 768px) { #social-collaboration-examples .list-a li { padding-bottom: 10px; cursor: pointer; text-decoration: underline; } #social-collaboration-examples .list-a li:nth-child(n+5) { margin-top: 20px; } #social-collaboration-examples .list-a li:hover { text-decoration: none;} } @media (max-width: 1100px) { .modal-content { width: 90%; padding: 35px 20px 20px; } .modal-content > div { max-height: calc(100vh - 200px); overflow-y: auto; } #researcher-list { justify-content: space-between;} #researcher-list li { width: calc(50% - 7px); font-size: 1.6rem; } } @media (max-width: 767px) { #social-collaboration-examples .list-a li { padding-bottom: 5px;} }