@charset "utf-8";

/*------------------------------------
汎用
------------------------------------*/
:root {
  --color-green: #028760;
}

/*汎用flex*/
.flex {display: flex;}

/*clearfix*/
.cf:after {content: ""; display: block; clear: both; visibility: hidden;}

/*明朝*/
.serif,
.serif * {font-family: "Noto Serif JP", YuMincho, "Hiragino Mincho ProN", serif; font-weight: 600;}

/*汎用ヘッダー*/
.h-g > * {display: block; text-align: center; text-indent: .08em;}
.h-g .big {line-height: 1.5;}
.h-g .small {line-height: 1;}

/*パンくずリスト*/
.breadcrumbs {border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; overflow-x: auto;}
.breadcrumbs ul {align-items: center; margin: 0 auto;}
.breadcrumbs ul li {font-size: 12px; line-height: 1; margin: 0.55rem;}
.breadcrumbs ul li a {color: #333;}
.breadcrumbs ul li a:hover {color: var(--color-green);}
.breadcrumbs ul li img,
.breadcrumbs ul li svg {width: auto;}
.breadcrumbs ul li a .home {height: 18px;}
.breadcrumbs ul li a .home .st0 {fill: #333;}
.breadcrumbs ul li a:hover .home .st0 {fill: var(--color-green);}
.breadcrumbs ul li .right {height: 8px;}

/*ページネーション*/
.pagination {justify-content: center; align-items: center; margin: 60px 0;}
.pagination span, .pagination a {padding: 12px 14px; background: #fff;}
.pagination a {color: var(--color-green);}
.pagination a:hover, .pagination .current {color: #fff; background: var(--color-green);}

/*more*/
.more {text-align: center;}
.more a {display: inline-block; position: relative; text-align: center; background: var(--color-green); cursor: pointer; transition: .4s ease;}
.more span {display: block; position: relative; color: #fff; font-weight: 700; letter-spacing: .1em; text-indent: .1em; padding: .8em 1.5em; transition: .4s ease;}
.more a:before,
.more a:after,
.more span:before,
.more span:after {position: absolute; content: ""; background: var(--color-green);}
.more a:before, .more a:after {right: 0; top: 0;}
.more span:before, .more span:after {left: 0; bottom: 0;}
.more a:before,
.more span:before {width: 1px; height: 0;}
.more a:after,
.more span:after {width: 0; height: 1px;}

.more a:hover {background: #fff;}
.more a:hover:before,
.more span:hover:before {animation: moreHeight .4s ease .3s forwards;}
.more a:hover:after,
.more span:hover:after {animation: moreWidth .4s ease .35s forwards;}
.more span:hover {color: var(--color-green);}

@keyframes moreHeight {
	0% {height: 0}
	100% {height: 100%;}
}
@keyframes moreWidth {
	0% {width: 0}
	100% {width: 100%;}
}

/*サブ要素ナビ*/
.sub_cat_navi {box-shadow: 0 0 0 1px #ccc;}
.sub_cat_navi ul {justify-content: space-between;}
.sub_cat_navi ul li {display: block; width: 100%;}
.sub_cat_navi ul li a {display: block; color: #333; font-size: 14px; text-align: center; padding: 10px 0;}
.sub_cat_navi li a:hover {color: #fff; background: var(--color-green); box-shadow: 0 0 0 1px var(--color-green);}

.h-news_list,
.h-works_list {justify-content: flex-start; flex-wrap: wrap;}
.h-news_entry a,
.h-works_entry a {display: block; position: relative; width: 100%; overflow: hidden;}
.h-news_entry a img,
.h-works_entry a img {width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; font-family: 'object-fit: cover; object-position: 50% 50%;'; transition: .5s ease;}
.h-news_entry a:hover img,
.h-works_entry a:hover img {transform: scale(1.1,1.1);}
.h-news_entry a .cat,
.h-works_entry a .cat {position: absolute; display: block; right: 0; color: #fff; line-height: 1; background: var(--color-green); z-index: 1;}
.h-news_entry .text h2,
.h-works_entry .text h2 {font-weight: 700; line-height: 1.5; margin: 4px 0 8px; padding: 8px; border-bottom: 1px solid #ccc;}
.h-news_entry .text p {line-height: 2; padding: 8px;}
.h-news_entry .text time,
.h-works_entry .text time {display: block; line-height: 2; text-align: right;}

/*------------------------------------
ヘッダー
------------------------------------*/
header {width: 100%; background: #fff; z-index: 9000;}
header .container {justify-content: space-between; align-items: center;}

/*------------------------------------
フッター
------------------------------------*/
footer {border-top: 1px solid #ccc;}

footer .info .add p,
footer .info .add a,
footer .info .add dl dt {color: #333; font-size: 13px; line-height: 1.75;}
footer .info .add a:hover {color: var(--color-green);}
footer .info .recruit {position: relative; display: flex; justify-content: center; align-items: center; gap: .3rem; color: #fff; background: var(--color-green); border: 1px solid var(--color-green);}
footer .info .recruit:after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background: #fff; transform: scale(0,1); transform-origin: right; transition: .3s ease; transition-property: transform,color; z-index: 1;}
footer .info .recruit span {position: relative; display: block; color: inherit; z-index: 2;}
footer .info .recruit svg {position: relative; width: 1em; fill: #fff; z-index: 2;}
footer .info .recruit:hover {color: var(--color-green);}
footer .info .recruit:hover:after {transform: scale(1,1); transform-origin: left;}
footer .info .recruit:hover svg {fill: var(--color-green);}
footer .info .add dl dt {font-weight: 700;}

footer .f-navi ul li a {display: inline-block; color: #333; font-size: 15px; line-height: 2; white-space: nowrap;}
footer .f-navi ul li a:hover {color: var(--color-green);}
footer .f-navi ul li a:before {content: ""; display: inline-block; position: relative;}
footer .f-navi ul li a:before {width: 12px; height: 12px; top: 1px; margin-right: 8px; background: url(../img/svg/footer-right.svg) 0 center/ 12px 12px;}
footer .f-navi ul li.cat-item a:before {width: 8px; height: 8px; top: -1px; left: 3px; margin-right: 12px; background: url(../img/svg/footer-right-sub.svg) 0 center/ 8px 8px;}

footer .copyright {font-size: 12px; text-align: center; border-top: 1px solid #ccc; padding: 12px 0;}

/*------------------------------------
ビルのUpSideDown
------------------------------------*/
#scroll {display: block; position: fixed; border-radius: 50%; background: var(--color-green); z-index: 2;}
#scroll:hover {transition: .3s ease;}
#scroll a {display: flex; justify-content: center; align-items: center;}
#scroll a img,
#scroll a svg {width: 12px; height: auto;}

/*------------------------------------
ロード画面
------------------------------------*/
#loader {position: fixed; width: 100vw; height: 100dvh; left: 0; top: 0; background: #eee; opacity: 1; visibility: visible; overflow: hidden; transition: .5s ease; z-index: 9999;}
#loader.fade {opacity: 0; visibility: hidden; z-index: -1;}
@keyframes load-fade {0% {visibility: visible; opacity: 1;} 100% {visibility: hidden; opacity: 0;}}
#loader svg {visibility: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 220px; height: auto; opacity: 0;}
#loader svg.vis {visibility: visible; animation: visiter ease .4s forwards;}
@keyframes visiter {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
トップページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/

/*事業内容*/
#front .business {padding: 20px 0 1px; background: #e4e4e4;}
#front .business .entry_list {flex-wrap: wrap;}
#front .business .entry img {position: relative; width: auto; margin: auto;}
#front .business .entry .text {background: #fff;}
#front .business .entry .text h3 {text-align: center; padding: 8px 0; border-bottom: 1px solid #aaa;}
#front .business .entry .text ul {padding: .75rem .5rem;}
#front .business .entry .text ul li {line-height: 2;}
#front .business .entry .text ul li:before {content: "≫"; padding: 0 .5rem 0 0;}

/*制作実績*/
#front .works .works_list {flex-wrap: wrap;}
#front .works .works_entry {display: block; position: relative; overflow: hidden; z-index: 1;}
#front .works .works_entry .cover {display: flex; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0,0,0, .5); opacity: 0; transition: .3s ease; z-index: 2;}
#front .works .works_entry .cover h3 {color: #fff; font-weight: 700; line-height: 1.5; text-align: center;}
#front .works .works_entry:hover .cover {opacity: 1;}
#front .works .works_entry img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50% 50%;'; transition: .5s ease;}
#front .works .works_entry .cat {position: absolute; display: block; right: 0; color: #fff; line-height: 1; background: var(--color-green); z-index: 1;}
#front .works .works_entry:hover img {transform: scale(1.1,1.1); opacity: 1;}
#front .works .works_entry:hover img .cat {opacity: 1;}

/*スタッフ*/
#front .member {background: #e4e4e4; padding-bottom: 10px;}
#front .member .member_list {margin: 0 auto; justify-content: flex-start; flex-wrap: wrap;}
#front .member .member_entry {cursor: pointer;}
#front .member .member_entry div {position: relative; width: 100%; height: 140px; border-radius: 50%; -webkit-perspective: 500px; perspective: 500px; transition: all .75s;}
#front .member .member_entry div img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; -webkit-backface-visibility:hidden; backface-visibility: hidden; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50% 50%;'; transition: all .75s;}
#front .member .member_entry div .front {transform: rotateY(0deg); z-index: 1;}
#front .member .member_entry div .back {transform: rotateY(180deg); z-index: 2;}
#front .member .member_entry:hover div .front {transform: rotateY(180deg); z-index: 1;}
#front .member .member_entry:hover div .back {transform: rotateY(0deg); z-index: 2;}
#front .member .member_entry p,
#front .member .member_entry h3 {text-align: center; transition: .3s ease;}
#front .member .member_entry:hover p,
#front .member .member_entry:hover h3 {color: var(--color-green);}
#front .member .member_entry p {font-size: 12px; font-weight: 700;}

/*(((( ；ﾟДﾟ)))ｶﾞｸｶﾞｸﾌﾞﾙﾌﾞﾙ*/
#front .member .member_entry.shake:hover {animation: buruburu .1s infinite;}

/* 紙吹雪 */
@keyframes bang {from {transform: translate3d(0, 0, 0);opacity: 1;}}
.hoverme {width: 240px;margin: 70px auto 0;text-align: center;cursor: pointer;position: relative;}
.hoverme span {color: #333;font-size: 0.9em;}
.hoverme i {position: absolute;display: block;left: 50%;top: 240px;width: 3px;height: 5px;background: red;opacity: 0;}
.hoverme:hover i:nth-of-type(1) {transform: translate3d(-20px, -22px, 0) rotate(193deg); background: #00ff88; animation: bang 700ms ease-out forwards; opacity: 0;}
.hoverme:hover i:nth-of-type(2) {transform: translate3d(15px, 12px, 0) rotate(53deg);background: #f2ff00;animation: bang 700ms ease-out forwards;	opacity: 0;}
.hoverme:hover i:nth-of-type(3) {transform: translate3d(-10px, 12px, 0) rotate(30deg);background: #ffc400;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(4) {transform: translate3d(-44px, -15px, 0) rotate(330deg);background: #f700ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(5) {transform: translate3d(9px, -36px, 0) rotate(95deg);background: #00ff59;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(6) {transform: translate3d(67px, -43px, 0) rotate(155deg);background: #77ff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(7) {transform: translate3d(43px, -1px, 0) rotate(246deg);background: #84ff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(8) {transform: translate3d(-25px, -43px, 0) rotate(96deg);background: #ff0099;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(9) {transform: translate3d(12px, -47px, 0) rotate(93deg);background: #004dff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(10) {transform: translate3d(8px, -13px, 0) rotate(286deg);background: #0084ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(11) {transform: translate3d(42px, -11px, 0) rotate(127deg);background: #00ff7b;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(12) {transform: translate3d(-45px, -24px, 0) rotate(108deg);background: #3700ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(13) {transform: translate3d(-55px, 9px, 0) rotate(222deg);background: #ff7700;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(14) {transform: translate3d(21px, 13px, 0) rotate(275deg);background: #ff00ea;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(15) {transform: translate3d(-35px, -10px, 0) rotate(89deg);background: #0d00ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(16) {transform: translate3d(-74px, -41px, 0) rotate(320deg);background: #00ff33;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(17) {transform: translate3d(-73px, 11px, 0) rotate(135deg);background: fuchsia;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(18) {transform: translate3d(-77px, -49px, 0) rotate(197deg);background: #00ff77;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(19) {transform: translate3d(19px, -12px, 0) rotate(4deg);background: #001aff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(20) {transform: translate3d(15px, -18px, 0) rotate(319deg);background: #00ff4d;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(21) {transform: translate3d(-19px, 0px, 0) rotate(233deg);background: #ff00cc;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(22) {transform: translate3d(-64px, 13px, 0) rotate(13deg);background: #ffd900;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(23) {transform: translate3d(-68px, 1px, 0) rotate(150deg);background: #ff5e00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(24) {transform: translate3d(-95px, 8px, 0) rotate(17deg);background: #ff0900;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(25) {transform: translate3d(54px, 2px, 0) rotate(58deg);background: #ff005e;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(26) {transform: translate3d(67px, 10px, 0) rotate(173deg);background: #00ff33;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(27) {transform: translate3d(-58px, 2px, 0) rotate(188deg);background: #00c4ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(28) {transform: translate3d(91px, 3px, 0) rotate(265deg);background: #00f7ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(29) {transform: translate3d(60px, -36px, 0) rotate(295deg);background: #3700ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(30) {transform: translate3d(-43px, -13px, 0) rotate(179deg);background: #ff6200;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(31) {transform: translate3d(4px, 2px, 0) rotate(281deg);background: #00ff6f;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(32) {transform: translate3d(38px, -22px, 0) rotate(265deg);background: #4800ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(33) {transform: translate3d(40px, 7px, 0) rotate(2deg);background: #ffa600;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(34) {transform: translate3d(-68px, -36px, 0) rotate(360deg);background: #9500ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(35) {transform: translate3d(32px, -44px, 0) rotate(196deg);background: #00aeff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(36) {transform: translate3d(-7px, 13px, 0) rotate(112deg);background: #40ff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(37) {transform: translate3d(24px, -32px, 0) rotate(225deg);background: #0dff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(38) {transform: translate3d(40px, 8px, 0) rotate(140deg);background: #0080ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(39) {transform: translate3d(14px, -7px, 0) rotate(192deg);background: #00ffaa;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(40) {transform: translate3d(67px, -21px, 0) rotate(193deg);background: #8c00ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(41) {transform: translate3d(-2px, -47px, 0) rotate(9deg);background: #ff00fb;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(42) {transform: translate3d(92px, 10px, 0) rotate(60deg);background: #00ff84;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(43) {transform: translate3d(-62px, -24px, 0) rotate(197deg);background: #9100ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(44) {transform: translate3d(5px, 2px, 0) rotate(53deg);background: #1eff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(45) {transform: translate3d(-7px, -28px, 0) rotate(32deg);background: #ffd000;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(46) {transform: translate3d(-69px, 9px, 0) rotate(117deg);background: #5100ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(47) {transform: translate3d(-80px, 3px, 0) rotate(180deg);background: #7bff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(48) {transform: translate3d(-49px, -13px, 0) rotate(318deg);background: #a6ff00;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(49) {transform: translate3d(19px, -12px, 0) rotate(51deg);background: #8400ff;animation: bang 700ms ease-out forwards;opacity: 0;}
.hoverme:hover i:nth-of-type(50) {transform: translate3d(-21px, 8px, 0) rotate(2deg);background: #0026ff;animation: bang 700ms ease-out forwards;opacity: 0;}

#front .profile table tr td a {display: inline-flex; gap: .25em;}
#front .profile table tr td a svg {width: 1em;}
#front .profile table tr td a svg path {fill: var(--color-green);}

/*地図*/
#front .map .googlemap {position: relative; overflow: hidden; max-height: none;}
#front .map .googlemap iframe,
#front .map .googlemap object,
#front .map .googlemap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#front .map .traffic {display: block;}
#front .map .traffic li {margin: 0 0 .25em; padding-left: 1.25em; text-indent: -1.25em;}
#front .map .traffic li:before {content: "≫"; color: var(--color-green); padding-right: .5em;}

/*お知らせ*/
#front .news .news_list {display: block; margin: 0 auto;}
#front .news .news_entry {border-bottom: 1px solid #ccc;}
#front .news .news_entry:hover {opacity: 1; border-color: var(--color-green);}

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
下層ページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
/*------------------------------------
汎用
------------------------------------*/
#single-state {position: relative;}
#single-state h1 {line-height: 1.5;}
#single-state .cat {display: inline-box; float: left; color: #fff; font-size: 12px; line-height: 1; background: var(--color-green); padding: 4px 20px;}
#single-state time {display: inline-flex; align-items: center; float: left; font-size: 12px; line-height: 1; padding: 4px 12px;}
#single-state time img {width: 12px; margin-right: 5px;}
#single-state .viewsite {display: inline-flex; align-items: center; float: right; color: var(--color-green); font-size: 12px; line-height: 1; background: #fff; box-shadow: 0 0 0 1px var(--color-green);}
#single-state .viewsite img,
#single-state .viewsite svg {width: 14px; margin-right: 8px;}
#single-state .viewsite:hover {color: #fff; background: var(--color-green);}
#single-state .viewsite:hover svg .st0 {fill: #fff;}

.postlink.top {border-top: 1px solid var(--color-green);}
.postlink.bottom {border-bottom: 1px solid var(--color-green);}
.postlink span {display: inline-block;}
.postlink span.next {float: left;}
.postlink span.prev {float: right;}

/*------------------------------------
汎用投稿・固定ページ (single.php,page.php)
------------------------------------*/
#single .main_img {width: 100%; object-fit: cover; object-position: 50% 50%; font-family: 'object-fit: cover; object-position: 50% 50%;';}

#single h2,
#single h3,
#single h4 {line-height: 1.5; font-weight: 700; margin: 0 0 30px;}
#single h2 {text-align: center; border-top: 1px solid var(--color-green); border-bottom: 1px solid var(--color-green);}
#single h3 {border-left: 5px solid var(--color-green);}
#single h4 {position: relative;}
#single h4:before {position: absolute; content: ""; display: block; left: 0; background: var(--color-green);}

#single strong {font-weight: 700;}
#single em {font-style: italic;}

#single p,
#single ul,
#single ol {margin: 0 0 30px;}

#single ul li {margin-left: 1rem; list-style: disc;}
#single ol li {margin-left: 1rem; list-style: decimal;}
#single table {text-align: left; line-height: 1.5; border: 1px solid #ccc; border-collapse: collapse;}
#single table thead th,
#single table thead td,
#single table tfoot th,
#single table tfoot td {padding: .7rem 1.25rem; border-bottom: 2px solid var(--color-green); border-left: 1px solid #ccc;}
#single table thead th,
#single table tfoot th {background: #e4e4e4;}
#single table thead td,
#single table tfoot td {background: #fff;}
#single table tbody th,
#single table tbody td {vertical-align: top; padding: .5rem 1.25rem; border-bottom: 1px solid #ccc;}
#single table tbody th {background: #e4e4e4;}
#single table tbody td {border-left: 1px solid #ccc;}

/*------------------------------------
実績投稿 (single-works.php)
------------------------------------*/
#single-works {border-bottom: 1px solid var(--color-green);}
#single-works .main-img {display: block; position: relative;}
#single-works .main-img img {width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; font-family: 'object-fit: cover; object-position: 50% 50%;';}
#single-works .main-img iframe {position: absolute; top: 0; right: 0; width: 100%!important; height: 100%!important;}

#single-works .state {text-align: center;}
#single-works .state table {text-align: left; line-height: 1.5;}
#single-works .state table th,
#single-works .state table td {font-size: 14px; vertical-align: middle; padding: 7px 14px;}
#single-works .state table th {font-weight: 700;}
#single-works .state .overview {display: inline-block; text-align: left;}

#single-works .works-img {justify-content: center;}
#single-works .works-img.pc-small-img {flex-wrap: wrap;}
#single-works .works-img a img {width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; font-family: 'object-fit: cover; object-position: 50% 0%;';}
#single-works .works-img.sp-img a {position: relative;}
#single-works .works-img.sp-img a:before {position: absolute; display: inline-block; content: ''; background: url(../img/sp.png) center/100% no-repeat; z-index: 2;}

/*------------------------------------
お知らせ (category-news.php)
------------------------------------*/

/*------------------------------------
制作実績 (category-works.php)
------------------------------------*/

/*------------------------------------
MOBにできること (page-wecando.php)
------------------------------------*/
#wcd .wcd_list .wcd_entry {display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--color-green); box-sizing: border-box;}
#wcd .wcd_list .wcd_entry:last-child {margin-bottom: 0;}
#wcd .wcd_list .wcd_entry a {display: block; width: 100%;}
#wcd .wcd_list .wcd_entry img {display: block; width: 100%; border: 1px solid #ccc; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50% 50%;';}
#wcd .wcd_list .wcd_entry h2 {font-weight: 700; line-height: 1.5; border-left: 5px solid var(--color-green);}
#wcd .wcd_list .wcd_entry p {margin-bottom: auto;}
#wcd .wcd_list .wcd_entry p:not(:first-of-type) {padding-top: 10px;}
#wcd .wcd_list .wcd_entry a.link {display: inline-block; width: auto; line-height: 1; margin: 20px 0 0 auto; border-bottom: 1px solid transparent;}
#wcd .wcd_list .wcd_entry a.link:before {content: "≫"; padding-right: .5rem;}
#wcd .wcd_list .wcd_entry a.link:hover {border-color: var(--color-green);}

/*------------------------------------
採用情報 (page-recruit.php)
------------------------------------*/
#recruit .recruit_card-list .recruit_card-item {
	border: 1px solid #ccc;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-img {
	width: 100%;
	height: 160px;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
	font-family: 'object-fit: cover; object-position: 50% 50%;';
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-title {
	font-weight: 700;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-post-title {
	position: relative;
	font-weight: 700;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-post-title::before {
	content: '';
	display: block;
	border-top: 1px solid var(--color-green);
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	z-index: 1;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-post-title span {
	position: relative;
	display: inline-block;
	font-weight: 700;
	background: #fff;
	padding-right: 1em;
	z-index: 2;
}
#recruit .recruit_card-list .recruit_card-item .recruit_card-post-title span::before {
	content: "≫";
	color: var(--color-green);
	padding-right: .5em;
}

/*------------------------------------
お問い合わせ (page-contact.php)
------------------------------------*/
#contact .page-description {text-align: center;}
#contact .page-description p {margin-bottom: 30px;}
#contact .page-description a {border-bottom: 1px solid transparent;}
#contact .page-description a:hover {border-bottom-color: var(--color-green);}
#contact .page-description a.tel {display: inline-block; font-size: 25px; font-weight: 700; line-height: 1; margin: 8px 0;}

.form .tab_select {justify-content: center;}
.form .tab_select li {display: flex; flex-direction: column; justify-content: center; align-items: center; width: 50%; background: #fff; border: 1px solid var(--color-green); border-bottom: none; cursor: pointer; transition: .3s ease;}
.form .tab_select li img,
.form .tab_select li svg {height: 90px;}
.form .tab_select li svg .st0 {fill: var(--color-green);}
.form .tab_select li span {color: var(--color-green); line-height: 1; letter-spacing: 3px;}
.form .tab_select li.select {background: var(--color-green);}
.form .tab_select li.select svg .st0 {fill: #fff;}
.form .tab_select li.select span {color: #fff;}

.form .tab_content {display: flex; overflow: hidden;}
.form .tab_content li {min-width: 100%; border: 1px solid var(--color-green); box-sizing: border-box;}
.form .tab_content li p.center {text-align: center;}
.form .tab_content li p.center em {color: var(--color-green);}

.form .tab_content .inner {margin: 0 auto; text-align: center;}
.form .tab_content dl {padding: 20px 0; border-bottom: 1px solid #eee;}
.form .tab_content dl:last-child {border-bottom: none;}
.form .tab_content dt,
.form .tab_content dd {box-sizing: border-box;}
.form .tab_content dt p {display: flex; justify-content: space-between; align-items: center; font-weight: 700;}
.form .tab_content dt span {color: #fff; font-size: .85em; line-height: 1; white-space: nowrap; background: var(--color-green); margin-left: auto; padding: 7px 8px 6px;}
.form .tab_content input[type="text"],
.form .tab_content input[type="email"],
.form .tab_content input[type="tel"],
.form .tab_content textarea {width: 100%; background: #eee!important; padding: 8px 12px; border: none; box-sizing: border-box; resize: vertical;}
.form .tab_content .cheak {position: relative; display: inline-block; cursor: pointer;}
.form .tab_content .wpcf7-radio {display: flex;}
.form .tab_content .wpcf7-radio .wpcf7-list-item-label {display: block; cursor: pointer;}
.form .tab_content input[type="radio"],
.form .tab_content input[type="checkbox"] {display: none;}
.form .tab_content span.wpcf7-list-item-label {display: block; position: relative;}
.form .tab_content span.wpcf7-list-item-label:before {content: ''; position: absolute; left: -34px; top: 0; width: 21px; height: 21px; border: 2px solid #e4e4e4;}
.form .tab_content span.wpcf7-list-item-label:after {content: ''; position: absolute; transform: rotate(-45deg); left: -29px; top: 6px; width: 12px; height: 6px; border: 3px solid var(--color-green); border-top: none; border-right: none; transition: .3s ease; opacity: 0;}
.form .tab_content input[type="checkbox"]:checked + span.wpcf7-list-item-label:after,
.form .tab_content input[type="radio"]:checked + span.wpcf7-list-item-label:after {opacity: 1;}
.form .tab_content input[type="submit"] {display: block; color: #fff; letter-spacing: 1.5px; background: var(--color-green); border: 1px solid var(--color-green); margin: 0 auto; transition: .3s ease-in-out;}
.form .tab_content input[type="submit"]:hover {color: var(--color-green); background: #fff;}
.form .tab_content .cheak {text-align: center;}
.form .tab_content .cheak .wpcf7-form-control-wrap,
.form .tab_content .cheak .wpcf7-form-control,
.form .tab_content .cheak .wpcf7-list-item,
.form .tab_content .cheak .wpcf7-list-item-label {display: block; width: 100%!important;}
.wpcf7-response-output {border: 1px solid #028760!important; color: #028760!important; text-align: center!important; background: transparent!important; margin-top: 40px!important;}

/*------------------------------------
404.php
------------------------------------*/
#notfound h1 span {display: block; line-height: 1; text-align: center;}
#notfound h1 span.big {color: var(--color-green); font-weight: 700;}
#notfound h1 span.small {font-size: 12px; letter-spacing: .5rem;}
#notfound p {text-align: center;}

/*------------------------------------
page-score.php
------------------------------------*/
#score .container {
	display: flex;
	flex-wrap: wrap;
	gap: 60px 0;
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	padding-bottom: 60px;
}
#score .score-sec {
	width: calc(100% / 2);
	padding: 0 50px;
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
}
#score .score-sec:nth-child(even):after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: #333;
}
#score .score-sec h2 {
	font-size: 18px;
	font-weight: 700;
	text-align: center;
}
#score .score-sec .sec-item {
	margin-top: 20px;
}
#score .score-sec .sec-item h3 {
	position: relative;
	padding-left: 1em;
}
#score .score-sec .sec-item h3::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	translate: 0 -50%;
	width: .5em;
	height: .5em;
	background: var(--color-green);
	border-radius: 50%;
}
#score .score-sec .sec-item ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 15px;
}
#score .score-sec .sec-item ul li a {
	position: relative;
	display: block;
	width: fit-content;
	padding-left: 30px;
	text-decoration: underline currentColor;
	translate: .3s ease;
}
#score .score-sec .sec-item ul li a::before {
	content: "";
	position: absolute;
	left: 3px;
	width: 25px;
	height: 25px;
	background-image: url("../img/common/pdf-icon.png");
	background-repeat: no-repeat;
	background-size: contain;
}
#score .score-sec .sec-item ul li a:hover {
	text-decoration-color: transparent;
}

/*------------------------------------
reCAPTCHA
------------------------------------*/
.grecaptcha-badge {
	bottom: 110px!important;
}