/* main-text */
.sub-main-box .main-text {margin:20px 0 0; border:1px solid #cccccc; border-radius:30px; padding:30px 30px;}
.sub-main-box .main-text p {font-size:16px;text-align:center;word-break:keep-all;margin:0;padding:0;line-height:1.5;}
@media (max-width:991px){
.sub-main-box .main-text {margin:16px 0 0; border-radius:10px; padding:30px 15px;}
.sub-main-box .main-text p {font-size:15px;}
}

/* main-banner */
.sub-main-box .main-banner {margin:30px 0 0; display:flex; flex-wrap:wrap;}
.sub-main-box .main-banner .banner-left {flex:1; min-width:0;}
.sub-main-box .main-banner .banner-left > ul > li {display:none;}
.sub-main-box .main-banner .banner-left > ul > li.active {display:block;}
.sub-main-box .main-banner .banner-left > ul > li .inner {display:block; overflow:hidden; position:relative;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-image {border-radius:30px; position:relative; overflow:hidden; border:1px solid #e8e7e7;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-image:after {display:block; content:""; padding-bottom:60%;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-image img {position:absolute; left:0; top:0; width:100%; height:100%; transition:all ease 0.5s; object-fit:cover;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content {position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,0.28); border-radius:0 0 30px 30px; padding:24px 60px;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content p {font-size:30px; font-weight:600; color:#fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content small {display:block; font-size:20px; color:#fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.sub-main-box .main-banner .banner-left > ul > li .inner:hover .list-image img {transform:scale(1.1);}
.sub-main-box .main-banner .banner-right {width:365px; margin:0 0 0 35px; overflow:hidden;}
.sub-main-box .main-banner .banner-right ul {height:100%; display:flex; flex-direction:column;}
.sub-main-box .main-banner .banner-right ul li {width:100%; height:100%; margin:0 0 30px;}
.sub-main-box .main-banner .banner-right ul li:last-of-type {margin:0;}
.sub-main-box .main-banner .banner-right ul li .inner {display:block; height:100%; border-radius:30px; position:relative; overflow:hidden; border:1px solid #e8e7e7;}
.sub-main-box .main-banner .banner-right ul li .inner .list-image {position:absolute; left:0; top:0; width:100%; height:100%;}
.sub-main-box .main-banner .banner-right ul li .inner .list-image img {width:100%; height:100%; object-fit:cover; transition:all ease 0.5s;}
.sub-main-box .main-banner .banner-right ul li .inner:hover .list-image img {transform:scale(1.1);}
@media (max-width:1400px){
.sub-main-box .main-banner .banner-right {width:300px; margin:0 0 0 20px;}
.sub-main-box .main-banner .banner-right > ul > li {margin:0 0 10px;}
}
@media (max-width:991px){
.sub-main-box {margin:20px 0 0;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-image {border-radius:10px;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content {border-radius:0 0 10px 10px; padding:15px;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content p {font-size:18px;}
.sub-main-box .main-banner .banner-left > ul > li .inner .list-content small {font-size:14px;}
.sub-main-box .main-banner .banner-right {width:200px; margin:0 0 0 10px;}
.sub-main-box .main-banner .banner-right ul li .inner {border-radius:10px;}
}
@media (max-width:767px){
.sub-main-box .main-banner .banner-left {flex:none; width:100%;}
.sub-main-box .main-banner .banner-right {margin:10px 0 0; width:100%;}
.sub-main-box .main-banner .banner-right ul {flex-wrap:wrap; flex-direction:row;}
.sub-main-box .main-banner .banner-right ul li {flex:1; min-width:0; margin:0 5px 0 0;}
.sub-main-box .main-banner .banner-right ul li .inner:after {display:block; content:""; padding-bottom:60%;}
}

/* main-board */
.sub-main-box .main-board {margin:100px 0 0;}
.sub-main-box .main-board .board-head {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:0 0 30px; border-bottom:2px solid #333;}
.sub-main-box .main-board .board-head h2 {font-size:30px; font-weight:600;}
.sub-main-box .main-board .board-head ul {display:flex; flex-wrap:wrap; align-items:center;}
.sub-main-box .main-board .board-head ul li {margin:0 10px 0 0;}
.sub-main-box .main-board .board-head ul li:last-of-type {margin:0;}
.sub-main-box .main-board .board-head ul li > * {width:120px; height:40px; border-radius:4px; border:1px solid #ccc; font-size:17px; font-weight:500; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.sub-main-box .main-board .board-head ul li:hover > * {background:#000; color:#fff; border-color:#000;}
.sub-main-box .main-board .board-head ul li.active > * {background:#000; color:#fff; border-color:#000;}
.sub-main-box .main-board .board-body {padding:50px;}
.sub-main-box .main-board .board-body ul {display:flex; flex-wrap:wrap; margin:0 -25px;}
.sub-main-box .main-board .board-body ul > li {width:calc(33.33% - 50px); margin:0 25px;}
.sub-main-box .main-board .board-body ul > li .inner {display:block;}
.sub-main-box .main-board .board-body ul > li .inner time {font-size:15px; color:#999; font-weight:500; display:block;}
.sub-main-box .main-board .board-body ul > li .inner p {margin:15px 0; font-size:22px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.sub-main-box .main-board .board-body ul > li .inner small {font-size:15px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; min-height:3em;}
.sub-main-box .main-board .board-body ul > li .inner:hover p {text-decoration:underline; color:var(--color-active);}
.sub-main-box .main-board .board-body .board-body-inner {display:none;}
.sub-main-box .main-board .board-body .board-body-inner.active {display:block;}
@media (max-width:991px){
.sub-main-box .main-board {margin:50px 0 0;}
.sub-main-box .main-board .board-head {padding:0 0 15px;}
.sub-main-box .main-board .board-head h2 {font-size:24px; text-align:center; width:100%;}
.sub-main-box .main-board .board-head ul {width:calc(100% + 32px); font-size:0; display:block; margin:15px -16px 0; overflow-x:auto; white-space:nowrap;}
.sub-main-box .main-board .board-head ul::-webkit-scrollbar {display:none;}
.sub-main-box .main-board .board-head ul li {display:inline-block; font-size:0; margin:0 5px 0 0;}
.sub-main-box .main-board .board-head ul li:first-of-type {margin-left:15px;}
.sub-main-box .main-board .board-head ul li:last-of-type {margin-right:15px;}
.sub-main-box .main-board .board-head ul li > * {width:100px; height:38px; font-size:14px;}
.sub-main-box .main-board .board-body {padding:20px 0;}
.sub-main-box .main-board .board-body ul {margin:0;}
.sub-main-box .main-board .board-body ul > li {width:100%; border-bottom:1px solid #ddd; padding:0 0 20px; margin:0 0 20px;}
.sub-main-box .main-board .board-body ul > li:last-of-type {border:0; padding:0; margin:0;}
.sub-main-box .main-board .board-body ul > li .inner time {font-size:13px;}
.sub-main-box .main-board .board-body ul > li .inner p {margin:10px 0; font-size:16px;}
.sub-main-box .main-board .board-body ul > li .inner small {font-size:14px;} 
}

/* main-category */
.sub-main-box .main-category {margin:50px 0 0;}
.sub-main-box .main-category .inner {background:#008f7e; border-radius:15px; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; position:relative;}
.sub-main-box .main-category .inner:before {position:absolute; left:100px; top:50%; transform:translateY(-50%); width:191px; height:131px; background:url('../images/img_main_cate_camera.png') no-repeat center / cover; content:"";}
.sub-main-box .main-category .inner ul {max-width:70%; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; width:100%; margin-right:70px;}
.sub-main-box .main-category .inner ul li {display:flex; flex-wrap:wrap; align-items:center;}
.sub-main-box .main-category .inner ul li:after {width:1px; height:28px; display:block; content:""; background:#047c6e; margin:0 50px;}
.sub-main-box .main-category .inner ul li:last-of-type:after {display:none;}
.sub-main-box .main-category .inner ul li a {height:90px; font-size:20px; font-weight:500; color:#fff; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.sub-main-box .main-category .inner ul li:hover a {text-decoration:underline;}
@media (max-width:1600px){
.sub-main-box .main-category .inner ul {margin-right:30px;}
.sub-main-box .main-category .inner ul li:after {margin:0 20px;}
}
@media (max-width:1200px){
.sub-main-box .main-category .inner:before {left:30px; width:151px; height:104px;}
.sub-main-box .main-category .inner ul {max-width:100%;}
.sub-main-box .main-category .inner ul li a {height:70px; font-size:17px;}
}
@media (max-width:991px){
.sub-main-box .main-category {margin:70px 0 0;}
.sub-main-box .main-category .inner {border-radius:10px; padding:40px 15px 30px;}
.sub-main-box .main-category .inner:before {left:-10px; top:-5px; width:121px; height:83px;}
.sub-main-box .main-category .inner ul {margin:0;}
.sub-main-box .main-category .inner ul li {width:33.33%; position:relative;}
.sub-main-box .main-category .inner ul li:after {position:absolute; right:0; top:50%; transform:translateY(-50%); height:15px; display:none;}
.sub-main-box .main-category .inner ul li:nth-of-type(3n):after {display:none;}
.sub-main-box .main-category .inner ul li a {height:50px; width:100%; font-size:15px;}
}

/* main-photo-gallery */
.sub-main-box .main-photo-gallery {margin:100px 0 0;}
.sub-main-box .main-photo-gallery .swiper-slide {width:auto !important; max-width:400px;}
.sub-main-box .main-photo-gallery .list-head {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 20px;}
.sub-main-box .main-photo-gallery .list-head h2 {font-size:30px; font-weight:600;}
.sub-main-box .main-photo-gallery .list-body .swiper-container {overflow:hidden;}
.sub-main-box .main-photo-gallery .list-body .swiper-slide a {display:block; position:relative; border-radius:10px; overflow:hidden;}
.sub-main-box .main-photo-gallery .list-body .swiper-slide a img {width:100%; height:200px; transition:all ease 0.5s; object-fit:cover;}
.sub-main-box .main-photo-gallery .list-body .swiper-slide a:hover img {transform:scale(1.1);}
@media (max-width:991px){
.sub-main-box .main-photo-gallery {margin:50px 0 0;}
.sub-main-box .main-photo-gallery .list-head {margin:0 0 15px;}
.sub-main-box .main-photo-gallery .list-head h2 {font-size:24px;}
.sub-main-box .main-photo-gallery .list-body .swiper-slide {max-width:250px;}
.sub-main-box .main-photo-gallery .list-body .swiper-slide a img {height:200px;}
}

/* greeting-box */
.greeting-box {display:flex; flex-wrap:wrap; align-items:flex-start;}
.greeting-box .list-left {text-align:right; width:270px;}
.greeting-box .list-left img {width:100%;}
.greeting-box .list-left b {display:block; text-align:right; margin:20px 0 0; font-size:18px; font-weight:500; padding:0 5px 0 0;}
.greeting-box .list-left p {font-size:25px; font-weight:500; padding:0 5px 0 0;}
.greeting-box .list-right {flex:1; min-width:0; padding:45px 0 0 90px;}
.greeting-box .list-right strong {font-size:25px; font-weight:500; display:block; margin:0 0 35px;}
.greeting-box .list-right p {font-size:18px; margin:0 0 20px; word-break:keep-all;}
.greeting-box .list-right p:last-of-type {margin:0;}
@media (max-width:1200px){
.greeting-box .list-right {padding:45px 0 0 30px;}
}
@media (max-width:991px){
.greeting-box {margin:40px 0 0;}
.greeting-box .list-left {margin-left:auto;}
.greeting-box .list-left img {width:200px;}
.greeting-box .list-left b {margin:10px 0 0; font-size:14px;}
.greeting-box .list-left p {font-size:18px;}
.greeting-box .list-right {flex:none; width:100%; padding:0; margin:20px 0 0;}
.greeting-box .list-right strong {font-size:20px; margin:0 0 20px;}
.greeting-box .list-right p {font-size:15px;}
}

.container.jihoe {display:flex;flex-direction:row-reverse;gap:var(--jihoe-gap);align-items:start;margin-top:30px;--jihoe-gap:60px;--jihoe-menu:200px;}
.jihoe-body {flex:auto;max-width:calc(100% - var(--jihoe-gap) - var(--jihoe-menu));}
aside.jihoe-menus {flex:0 0 var(--jihoe-menu);align-self:stretch;}
aside.jihoe-menus > div {position:sticky;top:0;max-height:100vh;overflow:auto;}
aside.jihoe-menus h2 {background:#008f7e;color:#fff;padding:26px 0;text-align:center;font-size:24px;font-weight:600;margin:0;}
aside.jihoe-menus ul {padding:24px 0;margin:0;list-style:none;}
aside.jihoe-menus a {font:inherit;}
aside.jihoe-menus li {font-size:16px;line-height:1.8;}
aside.jihoe-menus li > *::before {content:'\ECDE';font-family:Phosphor !important;font-weight:normal;margin-right:2px;}
aside.jihoe-menus li.main a::before {content:'\E2C2';}
aside.jihoe-menus li.daily a::before {content:'\E712';}
aside.jihoe-menus li.greeting a::before {content:'\EC38';}
aside.jihoe-menus li.link a::before {content:'\E2E2';}
aside.jihoe-menus li.board a::before {content:'\E230';}
aside.jihoe-menus li.gallery a::before {content:'\E2CA';}
aside.jihoe-menus li.group {margin:10px 0 5px 0;padding:0 0 5px 0;border-bottom:solid 1px;}
aside.jihoe-menus li.group strong::before {display:none;}
aside.jihoe-menus li.split:not(:has(+li.group)) {pointer-events:none;font-size:0;height:1px;background:#ddd;margin:4px 0;}
aside.jihoe-menus li.split:has(+li.group),
aside.jihoe-menus li:last-child.split {display:none;}
aside.jihoe-menus a.menu-toggle {display:none;}

.jibu-jihoe-list > ul {display:flex;padding:0;margin:0;list-style:none;align-items:stretch;gap:20px;flex-flow:row wrap;}
.jibu-jihoe-list > ul li {flex:1;border:solid 1px #eee;}
.jibu-jihoe-list > ul a {display:block;text-align:center;white-space:nowrap;padding:0 1rem;}
.jibu-jihoe-list > ul li:hover {border-color:#5c6bc0;}
.jibu-jihoe-list > ul a p:first-child {color:#5c6bc0;font-weight:bold;border-bottom:solid 1px;font-size:1.2em;}

@media (max-width:1440px) {
    .container.jihoe {--jihoe-gap:20px;--jihoe-menu:160px;}
}

@media (max-width:1200px) {
    .container.jihoe {display:block;--menu-width:52px;--jihoe-menu:0px;--jihoe-gap:0px;}
    .jihoe-body .title-box {background:rgba(255,255,255,.5);position:sticky;top:0;backdrop-filter:blur(20px);min-height:var(--menu-width);z-index:3;}
    aside.jihoe-menus {position:sticky;z-index:4;top:0;}
    aside.jihoe-menus a.menu-toggle.open {position:absolute;right:calc(0px - var(--container-padding) / 2);top:0;display:flex;flex-flow:column;width:var(--menu-width);height:var(--menu-width);align-items:center;justify-content:center;line-height:1.1;}
    aside.jihoe-menus a.menu-toggle.open {background:#008f7e;color:#fff;}
    aside.jihoe-menus a.menu-toggle.open span {color:inherit;font-size:12px;letter-spacing:1px;white-space:nowrap;line-height:1;}
    aside.jihoe-menus a.menu-toggle.open i {font-size:28px;color:inherit;font-weight:500;}
    aside.jihoe-menus a.menu-toggle.close {position:absolute;right:0;top:0;display:flex;align-items:center;justify-content:center;background:#2f6558;color:#fff;font-size:0;width:42px;height:42px;}
    aside.jihoe-menus a.menu-toggle.close::after {content:'\00D7';font-size:24px;line-height:0;}

    aside.jihoe-menus > div {position:fixed;left:0;top:0;width:100%;height:100%;background:#fff;visibility:hidden;opacity:0;transform:translateX(100px);transition:all .3s;}
    aside.jihoe-menus > div.on {display:block;visibility:visible;opacity:1;transform:none;}
    aside.jihoe-menus ul {padding:24px;}

    body:has(aside.jihoe-menus > div.on) {overflow:hidden;}
    body:has(aside.jihoe-menus > div.on) > header,
    body:has(aside.jihoe-menus > div.on) > footer {visibility:hidden;}
}

@media (max-width:991px) {
    .container.jihoe {--menu-width:40px;}
    aside.jihoe-menus a.menu-toggle.open span {line-height:0.4;}
}

@media (max-width:480px) {
    .jihoe-body .title-box h2 {text-align:left;}
}

/* jihoe-main */
.jihoe-main h3 {font-size:1.4em;margin-top:2em;border-bottom:solid 1px #dfdfdf;}
.jihoe-main-contents {overflow-x:auto;max-width:100%;}
.jihoe-main-contents + hr {height:1px;border:0;background:#dfdfdf;margin:2em 0;}

.jihoe-main-members ul {padding:0;margin:0;list-style:none;display:flex;flex-flow:row wrap;gap:var(--gap);--gap:20px;--cols:3;}
.jihoe-main-members ul li {flex:0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));}
.jihoe-main-members ul li {display:flex;gap:16px;}
.jihoe-main-members a[data-uid] {color:#5c6bc0;}

.jihoe-main-members table {width:100%;border-collapse:collapse;border-spacing:0;border-top:solid 2px #333;}
.jihoe-main-members tr > * {border-right:solid 1px #ddd;border-bottom:solid 1px #ddd;padding:.8em 0;text-align:center;}
.jihoe-main-members tr > *:last-child {border-right:0;}
.jihoe-main-members thead {background:#f4f4f4;}
.jihoe-main-members tbody tr:hover {background:#f4f4ff;}

@media (max-width:991px) {
    .jihoe-main-members ul {--cols:2;}
}
@media (max-width:480px) {
    .jihoe-main-members ul {--cols:1;}
}

.jihoe-main .photos {overflow:auto;}
.jihoe-main .photos.init {overflow:hidden;}
.jihoe-main .photos > div {display:flex;gap:0px;flex-flow:row nowrap;}
.jihoe-main .photos a {position:relative;margin:0 10px;display:block;border-radius:10px;overflow:hidden;}
.jihoe-main .photos a img {max-width:300px;height:200px;object-fit:cover;vertical-align:middle;}
.jihoe-main .photos a div {position:absolute;bottom:0;left:0;padding:10px;width:100%;background:rgba(0,0,0,.2);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.jihoe-main .photos a:hover div {background:rgba(0,0,0,.75);}

.jihoe-main .articles {overflow:auto;}
.jihoe-main .articles.init {overflow:hidden;}
.jihoe-main .articles > div {display:flex;flex-flow:row nowrap;}
.jihoe-main .articles .item {flex:0 0 32%;border:solid 1px #dfdfdf;padding:1rem;margin-right:2%;border-radius:10px;}
.jihoe-main .articles .item:hover {background:#f0f8ff;}
.jihoe-main .articles a {color:#666;font-size:0.9em;display:block;}
.jihoe-main .articles a p {margin:12px 0;font-weight:bold;font-size:1.2rem;color:#000;height:2.2em;line-height:1.1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}

@media (max-width:991px) {
    .jihoe-main .articles .item {flex:0 0 49%;margin-right:2%;}
}

@media (max-width:480px) {
    .jihoe-main .articles .item {flex:0 0 100%;}
}