@charset "UTF-8";
/*
Theme Name: Palau International Coral Reef Center
Author: Kazuma Kawahara
Description: The official theme of Palau International Coral Reef Center
Version: 1.0
*/
/* デフォルト */
.clearfix::after { content: ""; display: block; clear: both; }

/* メディアクエリのmixin*/
/*///コンテンツ幅*/
/*/// media query*/
/* メディアサイズによる表示分け //*/
@media (max-width: 599px) { .pc { display: none !important; } }
@media (min-width: 600px) { .sp { display: none !important; } }
/* box-sizing: border-box; の継承*/
*, *:before, *:after { box-sizing: inherit; }

html { box-sizing: border-box; overflow: auto; }

/* リストスタイル */
ul, ol { list-style-type: none; padding: 0; }

/* link */
a { text-decoration: none; display: block; font-weight: bold; color: #000; }

/* images */
img { width: 100%; }

/* flexBox */
.flexBox { display: flex; flex-wrap: wrap; }

/* Uppercase */
.uppercase { text-transform: uppercase; }

/*フォントサイズ調整*/
html { font-size: 62.5%; /*htmlの基準のフォントサイズを10pxに変更*/ }

/*/ 画面に合わせて拡縮  ///*/
/* 横幅500pxの場合を基準に計算*/
/* フォントサイズfz_vw*/
/*フォント*/
/* 色設定*/
/********** common setting **********/
body { font-family: Arial, Verdana, sans-serif; font-size: 16px; font-size: 1.6rem; line-height: 1.5; }
@media (min-width: 600px) { body { min-width: 1020px; } }

.lFont { font-size: 28px; font-size: 2.8rem; }
@media (min-width: 600px) { .lFont { font-size: 50px; font-size: 5rem; } }

.mlFont { font-size: 20px; font-size: 2rem; }
@media (min-width: 600px) { .mlFont { font-size: 36px; font-size: 3.6rem; } }

.mFont { font-size: 18px; font-size: 1.8rem; }
@media (min-width: 600px) { .mFont { font-size: 28px; font-size: 2.8rem; } }

.sFont, .single #news .inner .pagination .nav-links .page-numbers li .page-numbers, .archive #news .inner .pagination .nav-links .page-numbers li .page-numbers { font-size: 16px; font-size: 1.6rem; }
@media (min-width: 600px) { .sFont, .single #news .inner .pagination .nav-links .page-numbers li .page-numbers, .archive #news .inner .pagination .nav-links .page-numbers li .page-numbers { font-size: 24px; font-size: 2.4rem; } }

.center { text-align: center; }

.left { text-align: left; }

@media (min-width: 600px) { .headerIn, .inner { width: 1020px; margin: auto; } }

section { /*
padding-top: 2rem;
overflow: hidden;
*/ position: relative; background-color: #fff; }
@media (min-width: 600px) { section { padding-bottom: 2rem; min-width: 1000px; } }
section:last-child { padding-bottom: 4rem; }

.inner { position: relative; }
@media (min-width: 600px) { .inner { padding: 0 1rem; } }
@media (max-width: 599px) { .inner { width: 90%; margin: auto; } }

@media (min-width: 600px) { #our-works section .inner .container .item { width: 49%; margin-right: 2%; }
  #our-works section .inner .container .item:nth-child(2n) { margin-right: 0; } }

.wp-block-gallery .wp-block-image { flex-grow: initial !important; }

.bgk, header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li { background-color: #000; color: #fff; }
.bgk a, header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li a, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li a { color: #fff; }

.bgy, .single-work .supButton .wp-block-button { background-color: #FFDD00; color: #000; }
.bgy a, .single-work .supButton .wp-block-button a, .bgy .wp-block-button__link, .single-work .supButton .wp-block-button .wp-block-button__link { color: #000; }

.bgSub { background-color: #DDDDDD; color: #000; }
.bgSub a { color: #000; }

.hover-btnB:hover, .single-work .supButton .wp-block-button:hover { background: #000; }
.hover-btnB:hover a, .single-work .supButton .wp-block-button:hover a { color: #FFDD00 !important; }

.hover-btnY:hover, header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li:hover, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li:hover { background: #FFDD00; }
.hover-btnY:hover a, header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li:hover a, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li:hover a { color: #000 !important; }

.sectLine { border-top: 3px solid #DDDDDD; }

.shortBar { position: relative; }
.shortBar:after { content: ''; width: 4rem; height: 4px; position: absolute; left: 50%; transform: translateX(-50%); background-color: #000; bottom: -1rem; }
@media (min-width: 600px) { .shortBar:after { width: 6rem; height: 6px; } }

#follow .snsBox { display: flex; align-items: flex-start; justify-content: center; flex-wrap: nowrap; padding: 1rem 0; }
#follow .snsBox a { margin-right: 1%; width: calc((100% - 40px) / 5); }
@media (min-width: 600px) { #follow .snsBox a { width: 70px; } }
#follow .snsBox a:first-child { margin-left: 0; }
#follow .snsBox a:last-child { margin-right: 0; }

@media (max-width: 599px) { .spFullVW-media-text .wp-block-media-text__media, #facilities .wp-block-columns .wp-block-column figure, .single-work .wrapper .wp-block-image, #collaboration .container .wp-block-media-text__media { position: relative; width: 100% !important; height: 59vw; margin-right: 0 !important; margin-left: 0 !important; } }

@media (max-width: 599px) { .spFullVW-media-text .wp-block-media-text__media img, #facilities .wp-block-columns .wp-block-column figure img, .single-work .wrapper .wp-block-image img, #collaboration .container .wp-block-media-text__media img { width: 100vw !important; max-width: none !important; position: absolute; top: 0; left: 50%; transform: translateX(-50%); } }

@media (max-width: 599px) { .spFullVW-media-text .wp-block-media-text__content { padding: 0 !important; }
  .spFullVW-media-text .wp-block-media-text__media, .spFullVW-media-text .wp-block-media-text__content { margin-bottom: 2rem !important; margin-top: 0 !important; } }

.wp-block-button .wp-block-button__link { border: 0; background-color: transparent; }

.dotList { list-style-type: disc; padding-left: 5%; }
@media (min-width: 600px) { .dotList { list-style-position: inside; } }

#news .inner .newsContainer { flex-wrap: wrap; justify-content: space-around; }
#news .inner .newsContainer .newsBox { width: 100%; margin-bottom: 3rem; position: relative; }
@media (min-width: 600px) { #news .inner .newsContainer .newsBox { width: 45%; } }
#news .inner .newsContainer .newsBox a { display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; }
#news .inner .newsContainer .newsBox .thumbnailBox { position: relative; padding-top: 50%; overflow: hidden; margin-bottom: 1rem; }
#news .inner .newsContainer .newsBox .thumbnailBox img { position: absolute; top: 0; left: 0; }
#news .inner .newsContainer .newsBox h1 { margin: 0; }
#news .inner .newsContainer .newsBox span { display: inline-block; }
#news .inner .newsContainer .newsBox .category { padding: 0.5rem 1rem; }

/* 上部に戻るボタン */
#slideUp-btn { width: 60px; height: 60px; position: fixed; z-index: 100; right: -100px; bottom: 5px; opacity: 0.4; transition-duration: 0.3s; transition-property: opacity; }
@media (min-width: 600px) { #slideUp-btn { width: 80px; height: 80px; } }
#slideUp-btn:hover { opacity: 1; }
#slideUp-btn .size { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 60px; }

/* Burger Icon */
.burger { width: 40px; height: 40px; position: fixed; z-index: 200; top: 11vw; right: 3%; transform: translateY(-50%); cursor: pointer; background: none; border: 0; }
.burger .line { width: 40px; height: 30px; position: relative; display: block; }
.burger .line span { position: absolute; left: 0; width: 100%; height: 4px; background-color: #000; border-radius: 4px; transition: all .4s; }
.burger .line span:nth-of-type(1) { top: 0; }
.burger .line span:nth-of-type(2) { top: 13px; }
.burger .line span:nth-of-type(3) { bottom: 0; }
.burger .line.active span:nth-of-type(1) { transform: translateY(13px) rotate(-45deg); }
.burger .line.active span:nth-of-type(2) { opacity: 0; }
.burger .line.active span:nth-of-type(3) { transform: translateY(-13px) rotate(45deg); }

header #headerTop, header #globalNavContainer { width: 100%; }
header #headerTop .headerArea, header #globalNavContainer .headerArea { width: 100%; background-color: #fff; z-index: 20; transition: transform .4s; position: relative; }
header #headerTop .headerArea .headerIn, header #globalNavContainer .headerArea .headerIn { background-color: #fff; align-items: stretch; justify-content: space-between; /* global menu */ }
header #headerTop .headerArea .headerIn .logoBox, header #globalNavContainer .headerArea .headerIn .logoBox { width: 134px; margin: 0; }
@media (max-width: 599px) { header #headerTop .headerArea .headerIn .logoBox, header #globalNavContainer .headerArea .headerIn .logoBox { width: 55%; margin: auto; } }
header #headerTop .headerArea .headerIn .logoBox .custom-logo, header #globalNavContainer .headerArea .headerIn .logoBox .custom-logo { vertical-align: bottom; }
header #headerTop .headerArea .headerIn .gnav, header #globalNavContainer .headerArea .headerIn .gnav { font-weight: bold; position: relative; align-items: center; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list { height: 100%; margin: 0; display: flex; justify-content: center; align-items: center; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list li, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list li { padding-left: 15px; padding-right: 15px; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list li a, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list li a { display: block; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu { height: inherit; display: flex; align-items: center; position: relative; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu { position: absolute; left: 0; visibility: hidden; opacity: 0; -webkit-transition: all .2s ease; transition: all .2s ease; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li a, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .sub-menu li a { padding: 15px; white-space: nowrap; color: #fff !important; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu:hover .sub-menu, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu:hover .sub-menu { visibility: visible; opacity: 1; z-index: 19; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .hide, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .hide { display: none; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger { padding-left: 15px; padding-right: 15px; position: relative; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:before, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:before { position: absolute; top: 0; right: 0; left: 0; bottom: 0; content: ''; border-bottom: 1px solid #000; transform-origin: left bottom; transform: scale(0, 1); transition: transform .3s; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:hover, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:hover { background-color: #FFDD00; }
header #headerTop .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:hover:before, header #globalNavContainer .headerArea .headerIn .gnav .g-menu-list .g-menu .js-ac-trigger:hover:before { transform-origin: left top; transform: scale(1, 1); }
header #headerTop .headerArea .headerIn .donate, header #globalNavContainer .headerArea .headerIn .donate { line-height: 3rem; }
@media (max-width: 599px) { header #headerTop .headerArea .headerIn .donate, header #globalNavContainer .headerArea .headerIn .donate { width: 100vw; line-height: 1rem; } }
header #headerTop .headerArea { position: fixed; top: 0; }
@media (max-width: 599px) { header #globalNavContainer .headerArea { position: fixed; top: 0; } }

/* accordion menu */
#sp-menu { display: none; z-index: 100; position: fixed; right: 0; }
#sp-menu .flexBox { width: 100vw; align-items: stretch; border-bottom: 4px solid #fff; }
#sp-menu .flexBox .acMenu-list { width: 50%; margin: 0; }
#sp-menu .flexBox .acMenu-list:first-child { border-right: 4px solid #fff; }
#sp-menu .flexBox .acMenu-list .acMenu { border-bottom: 4px solid #fff; }
#sp-menu .flexBox .acMenu-list .acMenu a { line-height: 2.5rem; padding-top: 1.5rem; padding-bottom: 1.5rem; font-size: 16px; font-size: 3.2vw; }
#sp-menu .flexBox .acMenu-list .acMenu a:before { content: ''; width: 10%; height: 1px; display: inline-block; }
#sp-menu .flexBox .acMenu-list .acMenu .sub-menu .menu-item { padding-left: 15%; padding-right: 5%; margin-left: 0; position: relative; background-color: #666666; }
#sp-menu .flexBox .acMenu-list .acMenu .sub-menu .menu-item:before { content: ''; position: absolute; height: 1px; width: 50vw; background-color: #fff; top: 0; left: 0; }
#sp-menu .flexBox .acMenu-list .acMenu .sub-menu .menu-item a:before { content: none; }
#sp-menu .flexBox .right-col .acMenu:last-child { border-bottom: 0; }

/* Hero Image */
#heroContainer { margin: auto; height: 47vw; position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; }
@media (min-width: 600px) { #heroContainer { background-position: center; height: 400px; min-width: 1020px; background-size: cover; } }
#heroContainer .hero-title { width: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
@media (min-width: 600px) { #heroContainer .hero-title { width: 40%; } }

@media (min-width: 600px) { .single #heroContainer, .archive #heroContainer { height: 360px; } }

footer { position: relative; padding-top: 3rem; }
footer:before { content: ''; width: 100%; height: 3px; background-color: #FFDD00; position: absolute; top: 0; }
@media (min-width: 600px) { footer:before { min-width: 1020px; } }
footer .flexBox { justify-content: space-around; }
@media (min-width: 600px) { footer #ftMain .upLow .P30col, footer #ftMain .downLow .P30col { width: 30%; }
  footer #ftMain .upLow .P70col, footer #ftMain .downLow .P70col { width: 65%; margin-left: 2rem; } }
footer #ftMain .upLow { flex-wrap: wrap; align-items: flex-start; margin-bottom: 2rem; }
footer #ftMain .upLow .logoBox img { height: 100%; }
footer #ftMain .upLow #siteMapSP { margin: auto; flex-wrap: wrap; justify-content: center; }
footer #ftMain .upLow #siteMapSP .column { width: 50%; padding-left: calc(50vw - 50%); }
footer #ftMain .upLow #siteMapSP .column .acMenu .sub-menu { padding-left: 15px; }
footer #ftMain .upLow #siteMapSP .column .acMenu .sub-menu li { margin: 2rem 0; }
footer #ftMain .upLow #siteMapSP .column .acMenu .sub-menu li a { font-weight: normal; }
footer #ftMain .upLow #siteMap #pageList { flex-wrap: nowrap; }
footer #ftMain .upLow #siteMap #pageList li { width: 20%; }
footer #ftMain .upLow #siteMap #pageList li .sub-menu { padding-left: 15px; }
footer #ftMain .upLow #siteMap #pageList li .sub-menu li { width: 100%; margin: 2rem 0; }
footer #ftMain .upLow #siteMap #pageList li .sub-menu li a { font-weight: normal; }
footer #ftMain .upLow #siteMap .list, footer #ftMain .upLow #siteMapSP .list { margin: 0; }
footer #ftMain .upLow #siteMap .list .page, footer #ftMain .upLow #siteMap .list .pagePoint, footer #ftMain .upLow #siteMapSP .list .page, footer #ftMain .upLow #siteMapSP .list .pagePoint { padding: 1rem 0; }
footer #ftMain .upLow #siteMap .list .page a, footer #ftMain .upLow #siteMap .list .pagePoint a, footer #ftMain .upLow #siteMapSP .list .page a, footer #ftMain .upLow #siteMapSP .list .pagePoint a { max-width: 135px; }
footer #ftMain .upLow #siteMap .list .pagePoint, footer #ftMain .upLow #siteMapSP .list .pagePoint { margin-left: 0; }
footer #ftMain .upLow #siteMap .list .pagePoint a, footer #ftMain .upLow #siteMapSP .list .pagePoint a { font-weight: normal; }
footer #ftMain .downLow { position: relative; margin-bottom: 3rem; }
@media (max-width: 599px) { footer #ftMain .downLow { padding-bottom: 6rem; } }
footer #ftMain .downLow #snsContainer { flex-wrap: nowrap; justify-content: space-between; }
@media (max-width: 599px) { footer #ftMain .downLow #snsContainer { width: 100%; } }
footer #ftMain .downLow #snsContainer a { width: calc((100% - 40px) / 5); }
footer #ftMain .downLow .donate { text-align: center; }
@media (max-width: 599px) { footer #ftMain .downLow .donate { width: 100vw; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); } }
footer #ftMain #ftInfo { margin-bottom: 3rem; }
footer #ftMain #ftInfo span { display: inline-block; padding-right: 1rem; }
footer #ftMain #copyRight { font-size: 8px; font-size: 1.6vw; }
@media (min-width: 600px) { footer #ftMain #copyRight { font-size: 10px; font-size: 1rem; } }

.anchor { position: relative; padding-top: 6rem; margin-top: -4rem; }
@media (max-width: 599px) { .anchor { padding-top: 15rem; margin-top: -13rem; } }

/* Top Page */
@media (min-width: 600px) { #home #pageHeader { height: auto; } }
@media (max-width: 599px) { #home #pageHeader { display: flex; flex-wrap: wrap; flex-direction: column-reverse; } }
#home #pageHeader #heroContainer { width: 100%; }
@media (min-width: 600px) { #home #pageHeader #heroContainer { height: auto; background-position: center; } }
#home #pageHeader #globalNavContainer { top: 0; z-index: 10; }
#home section { margin-bottom: 0; overflow: hidden; }
#home #philosophy .inner { padding-top: 6rem; }
#home #philosophy .inner .vision .title, #home #philosophy .inner .mission .title { font-weight: bold; }
#home #philosophy .inner .vision { padding-bottom: 2rem; }
#home #philosophy .inner .vision:after { background-color: #fff; bottom: 0; }
#home #philosophy .inner .mission { padding-top: 3rem; }
#home #philosophy .iconBox { padding-top: 2rem; flex-wrap: nowrap; justify-content: center; }
#home #philosophy .iconBox .card:first-child { margin-right: 2rem; }
#home #philosophy .iconBox .card .icon { width: 88px; }
@media (min-width: 600px) { #home #philosophy .iconBox .card .icon { width: 100px; } }
#home #philosophy .iconBox .card p { font-weight: bold; }
#home #topics { padding-bottom: 0; }
#home #topics .shortBar:after { background-color: #000; bottom: -1rem; }
#home #topics .gridContainer { padding-top: 2rem; margin-bottom: 0; }
#home #topics .gridContainer .row { flex-wrap: wrap; align-items: center; position: relative; }
@media (min-width: 600px) { #home #topics .gridContainer .row { height: 320px; flex-wrap: nowrap; }
  #home #topics .gridContainer .row:nth-child(even) { flex-direction: row-reverse; } }
#home #topics .gridContainer .row .topicLink { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; opacity: 0; }
#home #topics .gridContainer .row .topicLink:hover { opacity: 0.5; }
#home #topics .gridContainer .row .item { width: 100vw; }
@media (min-width: 600px) { #home #topics .gridContainer .row .item { width: 50%; } }
#home #topics .gridContainer .row .textCell .iconBox { display: block; margin-top: 2rem; }
#home #topics .gridContainer .row .textCell .iconBox .icon { width: 52px; }
@media (min-width: 600px) { #home #topics .gridContainer .row .textCell .iconBox .icon { width: 100px; } }
#home #topics .gridContainer .row .textCell p { display: block; width: 90%; margin: auto; }
#home #topics .gridContainer .row .imageCell { height: 56vw; background-size: cover; background-position: center; background-repeat: no-repeat; }
@media (min-width: 600px) { #home #topics .gridContainer .row .imageCell { height: inherit; } }
#home #support .inner .itemBox { width: 30%; position: relative; margin-bottom: 3rem; }
@media (max-width: 599px) { #home #support .inner .itemBox { width: 100%; }
  #home #support .inner .itemBox:nth-of-type(2):before, #home #support .inner .itemBox:nth-of-type(3):before { content: ''; position: absolute; width: 100vw; height: 3px; background-color: #DDDDDD; top: 0; left: 50%; transform: translateX(-50%); } }
#home #support .inner .itemBox .wp-block-buttons { width: 70%; margin: auto; }

/* Our People */
#people #heroContainer { background-position: center 0; }
@media (min-width: 600px) { #people #heroContainer { background-position-y: -5rem; } }
#people section .inner .wp-block-columns .item img, #people section .inner .wp-block-columns .item span { display: block; }
#people section .inner .wp-block-columns .item .name { font-weight: bold; }

/* Our Works */
#our-works section h1 { margin-top: 0.5rem; }
#our-works section .inner .iconBox { display: block; }
#our-works section .inner .iconBox img { margin: 0 1rem; width: 75px; vertical-align: bottom; }
@media (min-width: 600px) { #our-works section .inner .iconBox img { width: 100px; } }
#our-works section .inner .container .item { margin-bottom: 3rem; }
@media (max-width: 599px) { #our-works section .inner .container .item { position: relative; left: 50%; transform: translateX(-50%); } }
#our-works section .inner .container .item .thumbnailBox { height: 42vw; }
@media (min-width: 600px) { #our-works section .inner .container .item .thumbnailBox { width: 480px; height: 200px; overflow: hidden; } }
#our-works section .inner .container .item .thumbnailBox img { width: inherit; height: inherit; object-fit: cover; }
#our-works section .inner .container .item .linkAqua { position: relative; }
#our-works section .inner .container .item .linkAqua:hover { color: #33CCFF; }
#our-works section .inner .container .item .linkYellow:hover { color: #FFDD00; }
#our-works section .inner .container .item a { display: block; }
#our-works section .inner .container .item a img, #our-works section .inner .container .item a span { display: block; }
@media (max-width: 599px) { #our-works section .inner .container .item a .btImage { width: 100vw; } }
#our-works section .inner .container .item a .text { width: 90%; margin: 0 auto 1rem; font-weight: normal; }
#our-works section .inner .container .item a .moreBtn { border: 1px solid; width: 100px; margin: auto; padding-top: 1rem; padding-bottom: 1rem; position: relative; }
#our-works section .inner .container .item a .moreBtn:after { content: ''; position: absolute; top: 50%; width: 8px; height: 8px; border-top: 2px solid; border-right: 2px solid; -webkit-transform: rotate(45deg) translateY(-66%); transform: rotate(45deg) translateY(-66%); }
#our-works section .inner .container .item a .aqua { color: #33CCFF; }
#our-works section .inner .container .item a .yellow { color: #FFDD00; }

/* Donation */
#getinvolved #sect-donations { z-index: 4; }
#getinvolved #sect-donations .inner .itemBox .button { width: 100%; }
@media (min-width: 600px) { #getinvolved #sect-donations .inner .itemBox .button { width: 75%; } }
#getinvolved #sect-donations .inner .itemBox dl dt { font-weight: bold; }
#getinvolved #sect-donations .inner .itemBox dl dt h3 { margin-top: 0; margin-bottom: 0; }
#getinvolved #sect-donations .inner .itemBox dl dd { margin-left: 0; }
#getinvolved #sect-vacancy { z-index: 3; }
#getinvolved #sect-vacancy p { margin-top: 0; }
#getinvolved #sect-vacancy .snsBox { justify-content: center; }
#getinvolved #sect-vacancy .snsBox .wp-block-column { flex-grow: initial; flex-basis: auto; }
#getinvolved #sect-vacancy .snsBox .wp-block-column:not(:first-child) { margin-left: var(--wp--style--block-gap, 1em); }
#getinvolved #sect-vacancy .snsBox .wp-block-column .icon { max-width: 70px; }
#getinvolved #sect-internships { z-index: 2; }
#getinvolved #sect-volunteers { z-index: 1; }
@media (min-width: 600px) { #getinvolved #sect-internships .inner, #getinvolved #sect-volunteers .inner { padding-left: 2%; } }
#getinvolved #sect-internships .inner h3, #getinvolved #sect-volunteers .inner h3 { margin-bottom: 0; }
#getinvolved #sect-internships .inner .text, #getinvolved #sect-volunteers .inner .text { margin-top: 0; }
#getinvolved #sect-internships .inner .snsBox-mini, #getinvolved #sect-volunteers .inner .snsBox-mini { justify-content: flex-start; width: 80%; margin-bottom: 0; }
@media (min-width: 600px) { #getinvolved #sect-internships .inner .snsBox-mini, #getinvolved #sect-volunteers .inner .snsBox-mini { width: 30%; } }
#getinvolved #sect-internships .inner .snsBox-mini .wp-block-column:not(:first-child), #getinvolved #sect-volunteers .inner .snsBox-mini .wp-block-column:not(:first-child) { margin-left: var(--wp--style--block-gap, 1em); }
#getinvolved #sect-internships .inner .button, #getinvolved #sect-volunteers .inner .button { margin-top: 3rem; }
@media (min-width: 600px) { #getinvolved #sect-internships .inner .button, #getinvolved #sect-volunteers .inner .button { width: 50%; } }

#facilities section { padding-bottom: 0; }
#facilities section .container { padding-bottom: 4rem; margin-bottom: 0; }
#facilities section .box { margin-bottom: 2rem; }
#facilities section h4 { margin: 0; }
#facilities section .wp-block-media-text .wp-block-media-text__content h4, #facilities section .wp-block-media-text .wp-block-media-text__content p, #facilities section .wp-block-media-text .wp-block-media-text__content ul { margin: 0; }
#facilities .whiteLine { padding-top: 1px; }
#facilities .whiteLine:not(:last-child) { margin-bottom: 3px; }

#contact #contactDetails .container { margin: auto; }
@media (max-width: 599px) { #contact #contactDetails .container { width: 67%; } }
#contact #contactDetails .container .item h2 { font-size: 28px; font-size: 5.6vw; }
@media (min-width: 600px) { #contact #contactDetails .container .item h2 { font-size: 40px; font-size: 4rem; } }
#contact #mapContainer iframe { vertical-align: bottom; width: 100%; height: 69vw; }
@media (min-width: 600px) { #contact #mapContainer iframe { height: 400px; } }

/************************
*** work's child pages **
************************/
/****** Research ******/
.single-work .wrapper { margin-top: 3rem; }
@media (min-width: 600px) { .single-work .wrapper { margin-bottom: 5rem; } }
.single-work .wrapper .container { margin-bottom: 4rem; }
@media (min-width: 600px) { .single-work .wrapper .container .wp-block-media-text__content p { margin-top: 0; } }
.single-work .wrapper .container .year { font-weight: bold; }
.single-work .wrapper .reportContainer .wp-block-columns { justify-content: space-around; }
@media (min-width: 600px) { .single-work .wrapper .reportContainer .wp-block-columns { justify-content: center; } }
.single-work .wrapper .reportContainer .wp-block-columns .wp-block-column { flex-basis: auto !important; flex-grow: 0; width: 40%; }
@media (min-width: 600px) { .single-work .wrapper .reportContainer .wp-block-columns .wp-block-column { width: 22%; margin-left: 4%; margin-bottom: 2rem; }
  .single-work .wrapper .reportContainer .wp-block-columns .wp-block-column:last-child, .single-work .wrapper .reportContainer .wp-block-columns .wp-block-column:nth-child(4n) { margin-right: 0; } }
.single-work .wrapper .reportContainer .latest img { width: 50%; }
.single-work .wrapper .reportLink { position: relative; }
.single-work .wrapper .reportLink a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; opacity: 0; }
.single-work .wrapper .reportLink a:hover { opacity: 0.5; }
.single-work .wrapper .reportLink img { width: 65%; border: 1px solid #707070; }
.single-work .wrapper .textLink { display: inline-block; padding-right: 20px; margin-bottom: 3rem; font-weight: bold; }
.single-work .wrapper .textLink a { position: relative; }
.single-work .wrapper .textLink a:after { content: ''; position: absolute; top: 50%; width: 8px; height: 8px; border-top: 2px solid; border-right: 2px solid; -webkit-transform: rotate(45deg) translateY(-66%); transform: rotate(45deg) translateY(-66%); }
.single-work .backToWork { max-width: 200px; }
@media (max-width: 599px) { .single-work .backToWork { margin-top: 3rem !important; } }
.single-work .backToWork a { font-size: 16px; font-size: 1.6rem; }
.single-work .supButton { margin: auto; width: 70%; }
@media (min-width: 600px) { .single-work .supButton { max-width: 300px; } }
.single-work .supButton .note { display: block; font-weight: bold; font-size: 16px; font-size: 1.6rem; }
@media (max-width: 599px) { .single-work .allReport { width: 100%; } }

#coral .container .wp-block-media-text__content, #mpa .container .wp-block-media-text__content { padding-left: 0; }
@media (max-width: 599px) { #coral .container .wp-block-media-text__content, #mpa .container .wp-block-media-text__content { padding-right: 0; }
  #coral .container .wp-block-media-text__media, #mpa .container .wp-block-media-text__media { grid-row: 2; }
  #coral .container .wp-block-media-text__content, #mpa .container .wp-block-media-text__content { grid-row: 1; } }

/****** Education ******/
#artsandtides .thanksContainer { position: relative; height: 300px; }
@media (min-width: 600px) { #artsandtides .thanksContainer { height: 160px; } }
#artsandtides .thanksContainer .wp-block-group__inner-container { width: 100vw; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 2rem 0; background-color: #DDDDDD; }
@media (min-width: 600px) { #artsandtides .thanksContainer .wp-block-group__inner-container { min-width: 1020px; } }
#artsandtides .thanksContainer .thanks { width: 90%; margin: 0 auto; }
@media (min-width: 600px) { #artsandtides .thanksContainer .thanks { width: 1000px; } }
#artsandtides .wp-block-gallery .wp-block-image { margin-bottom: 5rem !important; }
#artsandtides .wp-block-gallery .wp-block-image figcaption { font-weight: bold; background: none; bottom: -3rem; color: #000; }

#journalarticles .container { margin-bottom: 4rem; }
#journalarticles .container .wp-block-group__inner-container .wp-block-columns { margin-bottom: 0; }
#journalarticles .container .wp-block-group__inner-container .wp-block-columns .wp-block-column p:first-child { border-top: 1px solid #000; padding-top: 3rem; }

#books .container { padding-top: 2rem; }
@media (max-width: 599px) { #books .container .wp-block-media-text__content { padding-left: 5%; } }
#books .container .wp-block-media-text__content p:first-child { margin-top: 0; }

.single #navContainer, .archive #navContainer { margin-bottom: 6rem; }
@media (min-width: 600px) { .single #navContainer, .archive #navContainer { margin-left: auto; margin-right: auto; width: 1000px; } }
.single #navContainer .categoryNav, .archive #navContainer .categoryNav { margin: 0; }
@media (min-width: 600px) { .single #navContainer .categoryNav, .archive #navContainer .categoryNav { flex-wrap: nowrap; justify-content: center; align-items: stretch; border: 0; margin-top: 4rem; } }
.single #navContainer .categoryNav li, .archive #navContainer .categoryNav li { width: 33.333333%; width: calc(100% / 3); line-height: 4rem; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.single #navContainer .categoryNav li:nth-child(3n), .archive #navContainer .categoryNav li:nth-child(3n) { border-right: 0; }
@media (min-width: 600px) { .single #navContainer .categoryNav li, .archive #navContainer .categoryNav li { width: 12.5%; border: 0; } }
.single #news .inner .pagination .nav-links .page-numbers, .archive #news .inner .pagination .nav-links .page-numbers { display: flex; justify-content: center; flex-wrap: nowrap; }
.single #news .inner .pagination .nav-links .page-numbers li, .archive #news .inner .pagination .nav-links .page-numbers li { margin-right: 2rem; }
.single #blogContent .inner .thumbnailArea, .archive #blogContent .inner .thumbnailArea { position: relative; height: 44.4vw; overflow: hidden; }
@media (min-width: 600px) { .single #blogContent .inner .thumbnailArea, .archive #blogContent .inner .thumbnailArea { height: 444px; } }
@media (max-width: 599px) { .single #blogContent .inner .thumbnailArea .thumbnailBox, .archive #blogContent .inner .thumbnailArea .thumbnailBox { width: 100vw; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } }
.single #blogContent .inner .postInfo, .archive #blogContent .inner .postInfo { margin-top: 1.5rem; margin-bottom: 1.5rem; justify-content: space-between; }
.single #blogContent .inner .postInfo .postDate, .archive #blogContent .inner .postInfo .postDate { font-weight: bold; }
.single #blogContent .inner article .categoryArea, .archive #blogContent .inner article .categoryArea { margin-bottom: 0; }
.single #blogContent .inner article .categoryArea .category, .archive #blogContent .inner article .categoryArea .category { display: inline-block; margin-right: 5px; padding: 5px; font-weight: bold; font-size: 14px; font-size: 1.4rem; }
.single #blogContent .inner article h1, .archive #blogContent .inner article h1 { margin-top: 0; }
