@charset "UTF-8";
@charset 'UTF-8';
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
 .slick-loading .slick-list
{
background: #fff url(https://webseisaku.site/cms/wp-content/themes/bam/css/ajax-loader.gif) center center no-repeat;
} @font-face
{
font-family: 'slick';
font-weight: normal;
font-style: normal;
src: url(https://webseisaku.site/cms/wp-content/themes/bam/css/fonts/slick.eot);
src: url(https://webseisaku.site/cms/wp-content/themes/bam/css/fonts/slick.eot?#iefix) format('embedded-opentype'), url(https://webseisaku.site/cms/wp-content/themes/bam/css/fonts/slick.woff) format('woff'), url(https://webseisaku.site/cms/wp-content/themes/bam/css/fonts/slick.ttf) format('truetype'), url(https://webseisaku.site/cms/wp-content/themes/bam/css/fonts/slick.svg#slick) format('svg');
} .slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}
.slick-prev:before,
.slick-next:before
{
font-family: 'slick';
font-size: 20px;
line-height: 1;
opacity: .75;
color: white;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-prev
{
left: -25px;
}
[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;
}
.slick-prev:before
{
content: '←';
}
[dir='rtl'] .slick-prev:before
{
content: '→';
}
.slick-next
{
right: -25px;
}
[dir='rtl'] .slick-next
{
right: auto;
left: -25px;
}
.slick-next:before
{
content: '→';
}
[dir='rtl'] .slick-next:before
{
content: '←';
} .slick-dotted.slick-slider
{
margin-bottom: 30px;
}
.slick-dots
{
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.slick-dots li
{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before
{
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}
  html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, a {
margin: 0;
padding: 0;
border: 0;
outline: 0;
list-style-type: none;
font-size: 100%;
vertical-align: baseline;
background: transparent;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body {
line-height: 1;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
nav ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
a {
margin: 0;
padding: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
} ins {
background-color: #ff9;
color: #000;
text-decoration: none;
} mark {
background-color: #ff9;
color: #000;
font-style: italic;
font-weight: bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom: 1px dotted;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
} hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}
input, select {
vertical-align: middle;
} input, textarea, select {
font-size: 16px!important;
} html {
font-size: 62.5%; }
body {
width: 100%;
margin: 0 auto;
font-size: 15px;
font-size: 1.5rem;
line-height: 1.6;
font-family: "Zen Kaku Gothic New","游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ ゴシック", sans-serif!important;
font-weight: 500;
letter-spacing: 0.09em;
color: #231B0F;
}
@media screen and (max-width: 767px) {
body {
font-size: 14px;
font-size: 1.4rem;
}
}
a {
color: #59ABF3;
text-decoration: none;
}
a, a:before, a:after {
-webkit-transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
color: #1D78C7;
}
a:hover {
text-decoration: none;
opacity: 0.6;
color: #59ABF3;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 400;
}
p {
font-weight: 500;
}
img {
max-width: 100%;
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 0px!important;
}
.cf:after {
content: "";
display: block;
clear: both;
}
.tel{
pointer-events: none;
}
.pc-only{
display: block;
}
.sp-only{
display: none;
}
.no-link{
pointer-events: none;
}
@media screen and (max-width: 767px){
.pc-only{
display: none;
}
.sp-only{
display: block;
}
.tel{
pointer-events:auto;
} 
} ::-moz-selection {
background: #dedede;
}
::selection {
background: #dedede;
}
::-moz-selection {
background: #dedede;
}   input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
border: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
} .l-header {
width: 100%;
max-width: 100vw;
-webkit-transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
}
.l-header .inner {
width: 100%;
max-width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 3%;
padding-right: 0;
margin-left: auto;
margin-right: auto;
position: relative;
}
.l-header-bar {
position: fixed;
top: 0;
left: 0;
width: 100%;
max-width: 100vw;
z-index: 3;
-webkit-transition: 0.4s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.4s cubic-bezier(0.17, 0.935, 0.305, 1);
background-color: #fff; }
.l-header-bar.fixed {
-webkit-transition: none;
transition: none;
background-color: #fff;
padding: 0;
transition: .5s ease-out;
}
.l-header-bar-container {
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 0em 0 0em 1em;
}
.l-header-left {
display: block;
width: 100%;
max-width: 290px;
position: relative;
}
.l-header-left .c-logo{
display: block;
width: 100%;
margin-right: 1em;
max-width: 290px;
height: 73px;
position: relative;
}
.l-header-left .c-logo img{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.l-header-left .c-logo .w-logo{
display: block;
}
.l-header-left .c-logo .b-logo{
display: none;
}
.open .l-header-left .c-logo .w-logo{
display: none;
}
.open .l-header-left .c-logo .b-logo{
display: block;
}
.l-header-right{
width: 90%;
}
.open .l-header-bar,
.open .l-header-bar.fixed{
background-color: transparent;
}
.open .l-header-left .c-logo,
.open .l-header .l-header-right .nav-header{
visibility: hidden;
}
.l-header .l-header-nav {
position: relative;
}
.l-header .l-header-nav ul,
.l-header .l-header-btn ul {
list-style: none;
display: flex;
justify-content: center;
flex-wrap: nowrap; }
.l-header .l-header-nav ul{
right: 160px;
}
.l-header .l-header-nav .l-menu,
.l-header .l-header-btn .l-menu {
text-align: center; font-size: 15px;
font-size: 1.4rem;
letter-spacing: 0;
text-align: center;
display: inline-block;
}
.l-header .l-header-nav .l-menu a,
.l-header .l-header-btn .l-menu a{
display: block;
position: relative;
text-decoration: none;
color: #000;
padding: 2.12em 1em;
font-size: 1.6rem;
background: transparent;
}
.open .l-header .l-header-nav .l-menu a,
.open .l-header .l-header-btn .l-menu a{
display: none;
}
.l-header .l-header-btn .l-menu > a:hover{
color: #fff;
background: rgba(49,62,97,1);
opacity: 1;
-webkit-transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
}
.l-header .l-header-btn .l-menu a:hover:before {
opacity: 1;
transition: 0.3s ease-in-out;
}
.l-header .l-header-btn .l-menu > a:before {
content: '';
position: absolute;
bottom: 25px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 81%;
height: 1px;
background-color: #fff;
opacity: 0;
-webkit-transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.16s cubic-bezier(0.17, 0.935, 0.305, 1);
z-index: 1;
}
.l-header .l-header-btn{
display: flex; align-items: center;
width: 120px;
flex-wrap: wrap;
margin: 0 0 0 auto;
}
.l-header .l-header-btn .h-mailbtn{
display: block;
max-width: 35px;
width: 100%;
}
.l-header .l-header-btn .h-mailbtn img{
display: block;
margin: 0 auto;
}
.l-header .l-menu:hover .menu {
max-height: 9999px;
opacity: 1;
}
.l-header .l-header-right .nav-header{
width: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
padding: 2em 2em 2em 0; 
}
.l-header .l-header-right .nav-header li a{
color: #000;
padding: 0 2em;
display: block;
line-height: 1;
position: relative;
} #drawer-menu{
visibility: hidden;
opacity: 0;
display: none;
}
#drawer-menu .inner {
padding: 15px;
}
#drawer-menu .p-drawer-nav {
display: flex;
width: 100%;
align-items: end;
justify-content: space-between;
height: 100vh;
flex-flow: row-reverse;
}
#drawer-menu .p-drawer-nav .drawer-left{
height: 100vh;
max-height: 100%;
width: 35%;
display: flex;
align-items: baseline;
justify-content: center;
padding: 9em 0 0;
}
#drawer-menu .p-drawer-nav .drawer-left .f-nav{
display: block;
width: 100%;
}
#drawer-menu .p-drawer-nav .drawer-left .f-nav .nav-l {
width: 50%;
color: #fff;
}
#drawer-menu .p-drawer-nav .drawer-left .f-nav .nav-l span{
display: block;
}
#drawer-menu .p-drawer-nav .drawer-left::-webkit-scrollbar{
width: 10px;
}
#drawer-menu .p-drawer-nav .drawer-left::-webkit-scrollbar-track{
background-color: #ccc;
}
#drawer-menu .p-drawer-nav .drawer-left::-webkit-scrollbar-thumb{
background-color: #252E47;
}
#drawer-menu .p-drawer-nav .drawer-right {
width: 35%;
padding-left: 3em;
padding-bottom: 4em;
}
#drawer-menu .p-drawer-nav .drawer-right .insta-box{
margin-top: 2em;
}
#drawer-menu {
width: 100%;
height: 100vh;
padding-bottom: 120px; background: rgb(82,112,88,.95);
position: fixed;
right: 0;
top: 0;
z-index: 3;
-webkit-transform: translateX(0px);
transform: translateX(0px);
-webkit-transition: 0.3s cubic-bezier(0.17, 0.935, 0.305, 1);
transition: 0.3s cubic-bezier(0.17, 0.935, 0.305, 1);  transition: 0.5s ease-in-out;
visibility: hidden;
opacity: 0;
display: block;
}
.open #drawer-menu{
visibility: visible;
opacity: 1;
} #navbtn{ outline: none;
border: none;
background: #2c2c2c;
width: 100%;
height: 120px;
cursor: pointer;
display: block;
position: relative;
border-radius: 5px 0 0 5px;
display: none;
} #navbtn span.cross {
position: absolute;
right: 26%;
width: 82%;
height: 1px;
background-color: #fff;
transform: translate(-0%,-50%);
}
.open #navbtn span.cross {
background-color:#fff;
}
.open .l-header .l-header-btn .h-mailbtn{
visibility: hidden;
}
#navbtn span {
display: inline-block;
transition: all .5s;
box-sizing: border-box;
}
#navbtn span.cross:nth-of-type(1) {
top: 49px;
width: 55%;
}
#navbtn span.cross:nth-of-type(2) {
top: 58px;
width: 55%;
}
#navbtn span.cross:nth-of-type(3) {
top: 66px;
width: 55%;
}
#navbtn .menutxt{
position: absolute;
color: #fff;
left: 50%;
bottom: 14px;
transform: translate(-50%, 0px);
width: 100%;
}
.open #navbtn span.cross {
position: absolute;
right: 23%;
}
.open #navbtn span.cross:nth-of-type(1) {
-webkit-transform: translateY(2px) rotate(-25deg);
transform: translateY(2px) rotate(-25deg);
width: 55%;
top: 42px;
}
.open #navbtn span.cross:nth-of-type(2) {
-webkit-transform: translateY(-4px) rotate(25deg);
transform: translateY(-4px) rotate(25deg);
width: 55%;
top: 47px;
}
.open #navbtn span.cross:nth-of-type(3) { 
display: none;
}
.apply-btn{
background-color: #579F73;
display: flex;
justify-content: center;
align-items: center;
border-radius: 5px 0 0 5px;
width: 100%;
max-width: 120px;
height: 120px;
position: fixed;
right: 0;
top: 0;
z-index: 3;
}
@media screen and (max-width: 1300px) {
.l-header .l-header-right .nav-header li a{
padding: 0 1em;
font-size: 1.4rem;
}
}
@media screen and (max-width: 1060px) {
.l-header .l-header-right .nav-header li a {
padding: 0 0.7em;
font-size: 1.4rem;
}
}
@media screen and (max-width: 1025px) {
.l-header .inner {
padding: 0;
}
.l-header .l-header-btn {
align-items: center;
width: 128px;
flex-wrap: nowrap;
margin: 0 0 0 auto;
flex-direction: row-reverse;
}
.apply-btn {
border-radius: 0px 0 0 5px;
width: 60px;
height: 60px;
}
.apply-btn img{
top: 4px;
position: relative;
}
#navbtn .menutxt {
left: 50%;
bottom: 10px;
transform: translate(-50%, 0px);
width: 100%;
font-size: 1rem;
}
.l-header-bar-container {
padding: 0 0 0 0.7em;
display: flex;
justify-content: space-between;
align-items: center;
}
.l-header-left {
max-width:158px;
padding-top: 0px;
}
.l-header-left .c-logo{
height: 60px;
max-width: 156px;
}
.l-header-left .c-logo img {
max-width:100%;
width: 100%;
}
.l-header .l-header-right .nav-header{
display: none;
}
#navbtn{
width: 60px;
height: 60px;
border-radius: 0;
display: block;
}
#navbtn span.cross:nth-of-type(1) {
top: 22px;
width: 55%;
}
#navbtn span.cross:nth-of-type(2) {
top: 30px;
}
#navbtn span.cross:nth-of-type(3) {
top: 38px;
width: 55%;
}
#navbtn span.cross {
right: 23%;
}
.open #navbtn span.cross:nth-of-type(1) {
top: 28px;
}
.open #navbtn span.cross:nth-of-type(2) {
top: 34px;
}
#navbtn p {
left: 50%;
top: 37px;
font-size:1.1rem;
}
#drawer-menu .p-drawer-nav {
display: block;
height: 80vh;
overflow-y: scroll;
padding-top: 0;
top: 6em;
position: relative;
}
#drawer-menu .p-drawer-nav::-webkit-scrollbar{
width: 5px;
}
#drawer-menu .p-drawer-nav::-webkit-scrollbar-track{
background-color: #ccc;
}
#drawer-menu .p-drawer-nav::-webkit-scrollbar-thumb{
background-color: #252E47;
}
#drawer-menu .p-drawer-nav .drawer-left {
width: 100%;
height: auto;
overflow: visible;
max-height: none;
padding: 0 1em 0;
}
#drawer-menu .p-drawer-nav .drawer-right {
} 
#drawer-menu .p-drawer-nav .drawer-left .f-nav .nav-l {
width: 100%;
padding: 1em 0;
display: block;
color: #000;
}
}
@media screen and (max-width: 768px) {
#drawer-menu .p-drawer-nav .drawer-left .company-profile .btn{
color: #fff;
border: 1px solid #fff;
}
#drawer-menu{
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/bg_nav.png) no-repeat;
background-size: cover;
}
#drawer-menu::before{
content: ''; background: rgb(255,255,255,0.99);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#drawer-menu .p-drawer-nav .drawer-left {
width: 100%;
}
#drawer-menu .p-drawer-nav .drawer-right{
width: 100%;
padding: 1em 1em;
}
#drawer-menu .p-drawer-nav .drawer-left .nav-wrapper {
padding: 0em 2em 0;
width: 100%;
border-right: none;
}
#drawer-menu .p-drawer-nav .drawer-left li a {
color: #fff;
}
#drawer-menu .p-drawer-nav .drawer-left .nav-wrapper-inner {
padding: 0 0 1em;
}
#drawer-menu .p-drawer-nav .drawer-left .company-profile {
width: 100%;
text-align: center;
margin-top: 3em;
color: #fff;
} 
#drawer-menu .p-drawer-nav .drawer-left ul{
padding-top: 0;
}
.open #navbtn span.cross{
background-color: #fff;
}
#drawer-menu .p-drawer-nav .drawer-left .company-profile .f-logo .b-logo{
display: none;
}
#drawer-menu .p-drawer-nav .drawer-left .company-profile .f-logo .w-logo{
display: block;
}
#drawer-menu .p-drawer-nav .drawer-left ul.child li a{
color: #fff;
padding-left: 2em;
}
} .l-footer{
background-color: #2A262C;
position: relative;
color: #fff;
display: flex;
}
.l-footer .f-inner{
justify-content: space-between;
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0 auto;
max-width: 1300px;
width: 100%;
padding: 3em 1em 2em;
}
.l-footer .f-inner .f-nav {
width: 100%;
margin-bottom: 2em;
}
.l-footer .f-inner .f-nav ul {
display: flex;
justify-content: center;
}
@media screen and (max-width: 767px) {
.l-footer .f-inner .f-nav ul {
display: block;
}
}
.l-footer .f-inner .f-nav ul li {
padding: 0 0.5em;
}
@media screen and (max-width: 767px) {
.l-footer .f-inner .f-nav ul li {
padding: 0;
}
.l-footer .f-inner .f-nav ul li:nth-child(n+2) {
margin-top: 0.5em;
}
}
.l-footer .f-inner .f-nav ul li a {
color: #fff;
}
.fix-btn{
max-width: 500px;
width: 100%;
display: flex;
bottom: 0;
position: fixed;
right: 0;
z-index: 1;
}
.fix-btn a{
display: block;
width: 50%;
color: #fff;
position: relative;
padding: 2.8em 0.5em 0.5em;
text-align: center;
font-size: 1.2rem;
}
@media screen and (min-width: 1026px){
.fix-btn{
display: none;
}
}
@media screen and (max-width: 1200px){
.l-footer .footer-left {
padding: 4em 2em 4em 2em;
}
.l-footer .footer-right {
padding: 3em 1em 2em;
}
.f-nav .nav-l {
font-size: 1.6rem;
}
.f-nav .nav-l span {
font-size: 1.4rem;
}
.f-nav .nav-l {
width: 49%;
}
}
@media screen and (max-width: 767px) {
.l-footer {
padding: 2em 0 1em;
display: block;
}
.l-footer .f-inner{
display: block;
padding: 0 1em;
}
.l-footer .f-inner .f-logo img{
display: block;
margin: 0 auto;
max-width: 75%;
}
.l-footer .f-inner .copyright{
text-align: center;
margin-top: 2em;
}
}  .inner{
width: 100%;
max-width: calc(1549px + 5% * 2);
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 3%;
padding-right: 3%;
margin-left: auto;
margin-right: auto;
position: relative;
}
.inner2{
width: 100%;
max-width: calc(1639px + 5% * 2);
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 3%;
padding-right: 3%;
margin-left: auto;
margin-right: auto;
position: relative;
}
.btn{
max-width:280px;
border: 2px solid transparent;
width: 100%;
display: block;
color: #fff;
background-color: #1B8E3E;
text-align: center;
font-size: 1.6rem;
padding: 1em 0.5em;
letter-spacing: 0.1em;
position: relative;
border-radius: 50px;
transition: transform 0.5s ease;
}
.btn:hover{
background-color: #fff;
color: #1B8E3E;
border: 2px solid #1B8E3E;
transition: transform 0.5s ease;
}
.page-ttl{
padding: 3em 0em 3em;
background-size: cover;
font-size: 3rem;
}
.page-ttl h1 span{
display: block;
font-weight: 900;
}
.page-ttl .en{
font-size:1.8rem;
margin-bottom: 0.2em;
}
.c-ttl{
font-family: "Zen Kaku Gothic New", sans-serif;
font-size: 6rem;
font-weight: 900;
}
.c-ttl span{
display: table;
font-size: 2.4rem;
font-weight:700;
position: relative;
padding: 0 1em;
margin: 0 0 0.5em;
}
.c-ttl span::before{
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/open_kakko.svg) no-repeat;
width: 15px;
height: 38px;
background-size: cover;
position: absolute;
left: 0;
top: 2px;
}
.c-ttl span::after{
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/close_kakko.svg) no-repeat;
width: 15px;
height: 38px;
background-size: cover;
position: absolute;
right: 0;
top: 2px;
}
.c-ttl.center{
text-align: center;
}
.c-ttl.center span{
margin: 0 auto 0.5em;
}
.c-ttl.white span::before{
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/open_kakko_w.svg) no-repeat;
background-size: cover;
}
.c-ttl.white span::after{
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/close_kakko_w.svg) no-repeat;
background-size: cover;
}
@media screen and (max-width: 1200px) {
.lower-page{
}
}
@media screen and (max-width: 767px) {
.inner{
padding-left: 5%;
padding-right: 5%;
}
.btn{
padding: 0.8em 0.5em;
font-size: 1.4rem;
max-width: 266px;
}
.page-ttl {
padding: 3em 0em 2em;
font-size: 1.8rem;
}
.page-ttl .en {
font-size: 1.4rem;
}
.c-ttl{
font-size: 2.5rem;
}
.c-ttl span{
font-size: 1.4rem;
margin: 0 0 1em;
}
.c-ttl.center span{
margin: 0 auto 1em;
}
.c-ttl span::before {
width: 10px;
height: 25px;
left: 0;
top: 0px;
}
.c-ttl span::after {
width: 10px;
height: 25px;
top: 0px;
}
} .wp-pagenavi {
margin: 0 auto;
font-size: 0;
text-align: center;
}
.wp-pagenavi .pages{
display: none;
}
.wp-pagenavi .last{
display: none;
}
.wp-pagenavi .first{
display: none;
}
.wp-pagenavi a, .wp-pagenavi span{
margin: 0;
padding: 12px 5px!important;
}
.wp-pagenavi .page, .wp-pagenavi .extend {
display: inline-block;
width: 45px;
height: auto;
line-height: 1;
font-size: 1.6rem;
color: #A5A5A5;
text-decoration: none;
text-align: center;
border: none;
}
.wp-pagenavi .page:hover, .wp-pagenavi .extend:hover {
opacity: 0.8;
}
.wp-pagenavi .current {
display: inline-block;
color: #626C76;
font-size: 1.6rem;
width: 45px;
height: auto;
line-height: 1;
font-size: 16px;
text-align: center;
border: none;
font-weight: 500!important;
border: 1px solid #626C76;
}
.nextpostslink{
width: 30px;
position: relative;
border: none!important;
}
.nextpostslink::before {
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/icon_pagenation_next.svg) no-repeat;
background-size: contain;
width: 10px; 
height: 9px;
position: absolute;
background-size: 100%;
top: 30%;
transform: translate(0, -50%);
}
.previouspostslink{
width: 30px;
position: relative;
border: none!important;
}
.previouspostslink::before {
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/icon_pagenation_prev.svg) no-repeat;
background-size: contain;
width: 10px; 
height: 9px;
position: absolute;
background-size: 100%;
top: 30%;
left: -37%;
transform: translate(0, -50%);
}
.aroundbox{
display: flex;
justify-content: space-around;
margin: 30px 0 0;
padding-top: 24px;
}
.aroundbox div{
width: 33.33%;
}
.aroundbox .wp-pagenavi{
width: auto;
}
.aroundbox div.prev{
padding-left: 20px;
}
.aroundbox div.prev a::before{
content: '';
position: absolute;
top: 50%;
left: -19px;
transform: translate(0,-50%);
box-sizing: border-box;
border-top: 1px solid #707070;
border-left: 1px solid #707070;
width: 4px;
height: 4px;
transform: rotate(-45deg) translate(-50%,-50%);
}
.aroundbox div.all{
text-align: center;
}
.aroundbox div.next{
text-align: right;
position: relative;
padding-right: 20px;
}
.aroundbox div.next a::before{
content: '';
border-top: 1px solid #707070;
border-right: 1px solid #707070;
width: 4px;
height: 4px;
transform: rotate(45deg) translate(-50%,-50%);
position: absolute;
top: 50%;
right: -19px;
}
.aroundbox a{
color: #000;
position: relative;
}
.aroundbox .btn{
color: #fff;
margin: 0 auto;
}
.aroundbox .btn:hover{
color: #1B8E3E;
}
.aroundbox.article-nav div.next a,
.aroundbox.article-nav div.prev a{
font-size: 0;
}
.aroundbox.article-nav div.next {
text-align: left;
}
.aroundbox.article-nav div.prev {
text-align: right;
}
.aroundbox.article-nav div.next a::before {
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/top/img_slidearrow_next.svg) no-repeat;
width: 20px;
position: absolute;
background-size: 100%;
top: 50%;
right: 8%;
transform: translate(0, -50%);
height: 9px;
border: none;
}
.aroundbox.article-nav div.prev a::before {
content: '';
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/top/img_slidearrow_prev.svg) no-repeat;
width: 20px;
position: absolute;
background-size: 100%;
top: 50%;
left: 8%;
transform: translate(0, -50%);
height: 9px;
border: none;
}
@media screen and (max-width: 767px) {
.wp-pagenavi .page, .wp-pagenavi .extend, .wp-pagenavi .current {
width: auto;
font-size: 1.4rem;
}
.aroundbox{
margin: 1em 0 0;
}
.aroundbox.archive div.prev{
display: none;
}
.aroundbox.archive div.next{
display: none;
}
.wp-pagenavi a, .wp-pagenavi span {
padding: 6px 6px!important;
}
} .c-breadcrumb {
padding: 10px 0 10px;
}
.c-breadcrumb ul {
padding: 1em 0 1em 5em;
background: transparent;
width: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-end;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.c-breadcrumb ul li{
position: relative;
font-size: 1.2rem;
font-weight: 500;
}
.c-breadcrumb ul li:first-child{
font-family: 'Montserrat', sans-serif;
}
.c-breadcrumb ul li::after{
content: '';
border-top: 1px solid #707070;
border-right: 1px solid #707070;
width: 4px;
height: 4px;
transform: rotate(45deg) translate(-50%,-50%);
position: absolute;
top: 50%;
right: -20px;
}
.c-breadcrumb ul li:last-child:after{
content: none;
}
.c-breadcrumb ul li {
margin-right: 3.2em;
}
.c-breadcrumb ul li:last-child{
margin-right: 0;
}
.c-breadcrumb ul li a {
color: #202625;
}
.c-breadcrumb ul li i {
margin-left: 10px;
}
@media screen and (max-width: 767px) {
.c-breadcrumb ul {
padding: 12px 0;
justify-content: flex-start;
}
} .matrix .bg-wrap,
.matrix .bg-wrap .inn {
display: block;
}
.matrix .bg-wrap {
overflow: hidden;
opacity: 0;
} .matrix .bg-wrap .inn {
opacity: 0;
transform: matrix(1, 0, 0, 1, 0, 100);
transition: 1.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.matrix.is-animated .bg-wrap {
opacity: 1;
}
.matrix.is-animated .bg-wrap .inn {
opacity: 1;
transform: matrix(1, 0, 0, 1, 0, 0);
} .element { transform: translateY(30px);
opacity: 0;
visibility: hidden;
transition: transform 1s, opacity 1s, visibility 1s;
}
.first-fade {
transform: translateY(30px);
opacity: 0;
visibility: hidden;
transition: transform 1s, opacity 1s, visibility 1s;
} .is-fadein {
transform: translateX(0);
opacity: 1;
visibility: visible;
}
.img-zwrap{
overflow: hidden;
}
.img-zwrap img{
display: block;
width: 100%;
transition-duration: 2s;
transform: scale(1.1);
}
.is-fadein .img-zwrap img{
transform: scale(1.0);
}
.is-fadein .img-anim {
overflow: hidden;
position: relative;
}
.is-fadein .img-anim:before {
animation: img-wrap 1.5s cubic-bezier(.4, 0, .2, 1) forwards;
background: #fff;
bottom: 0;
content: '';
left: 0;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
@keyframes img-wrap {
100% {
transform: translateX(100%);
}
}
@keyframes fadeinfirst {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
} #page-top {
bottom: 0;
position: fixed;
right: 0;
background-color: #1B8E3E;
cursor: pointer;
border-radius: 5px 0 0 0px;
z-index: 2;
}
#page-top a{
display: block;
position: relative;
width: 60px;
height: 60px;
}
#page-top span{
display: inline-block;
vertical-align: middle;
color: #fff;
line-height: 1;
width: 0;
height: 0;
border-style: solid;
border-color: transparent;
border-width: 0.64952em 0.375em;
border-bottom-color: currentColor;
border-top: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
@media screen and (max-width: 1200px) {
#page-top a {
width: 50px;
height: 50px;
}
} .mv-area{
background-color: #1EB05D;
width: 98%;
margin: 82px auto 0;
padding: 7em 0 3em;
border-radius: 10px; position: relative;
}
.mv-area .mv-slider{
overflow: hidden;
width: 26%; }
.mv-area .mv-slider img{
display: block;
margin: 0 auto;
}
.mv-area .mv-inner .logo-box{
width: 50%;
}
.mv-area .mv-inner{
display: flex;
justify-content: center;
margin: 0 auto;
position: relative;
z-index: 2;
}
.mv-area .mv-slider2 {
position: relative; margin-top: -136px;
}
.mv-area .mv-slider2 .slider-img{
margin: 0 30px;
}
.top-about-area{
padding: 5em 0 8em;
text-align: center;
}
.top-about-area p{
line-height: 1.8;
font-size: 2rem;
}
.top-about-area .c-ttl{
margin-bottom: 1em;
}
.top-service-area{
background-color: #25A54C;
padding: 6em 0;
color: #fff;
}
.top-service-area .service-desc {
width: 38%;
top: 0;
height: 65vh;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.top-service-area .service-desc p{
margin-top: 1.5em;
line-height: 1.8;
font-size: 2.2rem;
}
.top-service-area .s-inner{
max-width: 1750px;
width: 100%;
margin: 0 0 0 auto;
display: flex;
justify-content: space-between;
position: relative;
height: 100vh;
align-items: center;
padding-left: 3em;
}
.top-service-area .cp-wrap{
width: 66%;
overflow: hidden;
padding-left: 2em;
}
.top-service-area .characteristic-plan{
display: flex;
}
.top-service-area .characteristic-plan .c-box{
flex: 0 0 600px;
margin-right: 5em;
background: white;
border-radius: 20px;
padding: 7em 3em 6em;
box-sizing: border-box;
}
.top-service-area .characteristic-plan .c-box .c-name img{
display: block;
margin: 0 auto;
}
.top-service-area .characteristic-plan .c-box .character-ttl{
font-size: 3.6rem;
font-weight: 900;
color: #1EB05D;
text-align: center;
margin: 1.5em 0 1.5em;
}
.top-service-area .characteristic-plan .c-box .character-desc{
border-top: 1px solid #C4CDDB;
padding-top: 2em;
color: #000;
text-align: left;
line-height: 2;
}
.top-service-area .characteristic-plan {
display: flex;
width: max-content; }
.c-box {
flex: 0 0 80%;
margin-right: 2em;
background: white;
border-radius: 20px;
padding: 2em;
}
.top-plan-area{
background-color: #E8E9F9;
padding: 7em 0 6em;
}
.top-plan-area p{
text-align: center;
line-height: 1.7;
font-size: 2rem;
}
.top-plan-area .c-ttl{
text-align: center;
margin-bottom: 0.5em;
}
.top-plan-area .plan-list{
display: flex;
justify-content: space-between;
margin-top: 6em;
}
.top-plan-area .plan-list .plan-box{
background-color: #fff;
border-radius: 20px;
text-align: center;
padding: 3.5em 1.4em 2em;
width: 32%;
position: relative;
}
.top-plan-area .plan-list .plan-box .reccommend{
background-color: #1B8E3E;
color: #fff;
border-radius: 50px;
text-align: center;
max-width: 155px;
width: 100%;
padding: 0.5em 1em;
position: absolute;
top: -25px;
left: 50%;
transform: translate(-50%, 0);
font-size: 1.8rem;
}
.top-plan-area .plan-list .plan-box .plan-name{
font-weight: bold;
font-size: 4rem;
margin-bottom: 0.5em;
line-height: 1.5;
}
.top-plan-area .plan-list .plan-box .plan-name .small{
display: block;
font-size: 2rem;
font-weight: 500;
}
.top-plan-area .plan-list .plan-box img{
display: block;
margin: 0 auto;
max-width: 80%;
width: 100%;
}
.top-plan-area .plan-list .plan-box .desc-list{
display: flex;
justify-content: space-between;
border-top: 1px solid #C4CDDB;
padding-top: 1em;
margin-top: 2em;
}
.top-plan-area .plan-list .plan-box .desc-list .point{
font-size: 2rem;
position: relative;
padding-left: 1.5em;
} 
.top-plan-area .plan-list .plan-box .desc-list .point::before{
content: '';
display: block;
position: absolute;
top: .5em;
left: 0;
width: 19px;
height: 11px;
border-left: 4px solid #1EB05D;
border-bottom: 4px solid #1EB05D;
transform: rotate(-45deg);
}
.top-plan-area .last-catch{
text-align: center;
margin-top: 5em;
}
.top-works-area{
padding: 7em 0;
}
.top-works-area p{
text-align: center;
font-size: 2rem;
line-height: 1.8;
margin: 2em 0 4em;
}
.top-works-area .slick-dots li button:before{
font-size: 40px;
}
.case_study_list{
border: 1px solid #ddd;
color: #000;
display: block;
}
.case_study_list:hover{
color: #000;
}
.case_study_list .title_area{
padding: 4em 1.5em;
}
.case_study_list .title_area .title{
font-weight: bold;
font-size: 2rem;
}
.case_study_list .image_wrap {
margin: 0 -1px;
width: calc(100% + 2px);
height: auto;
max-height: 320px;
aspect-ratio: 515 / 320;
position: relative;
overflow: hidden;
z-index: 2;
}
.case_study_list .image_wrap img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
transition: transform 0.5s ease;
}
.case_study_list:hover .image_wrap img {
width: 100%;
height: 100%;
will-change: transform;
transition: transform 0.8s ease;
transform: scale(1.2);
}
.case_study_list .meta {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
padding: 0 40px;
height: 76px;
}
.case_study_list .meta ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.case_study_list .meta li {
margin: 3px 10px;
line-height: 1;
color: #000;
font-size: 2rem;
}
.case_study_list .meta .job {
color: #1B8E3E;
}
.top-works-area .btn{
margin: 4em auto 0;
}
.top-blog-area{
padding: 6em 0 8em;
}
.top-blog-area .blog-list{
margin: 3em 0;
}
.blog-list{
display: flex;
justify-content: space-between;
}
.blog-list .b-box{
width: 24%;
display: block;
color: #000;
}
.blog-list .b-box img{
height: auto;
}
.blog-list .title{
margin-top: 2em;
}
.blog-list .image_wrap {
margin: 0 -1px;
width: calc(100% + 2px);
height: auto;
max-height: 300px;
aspect-ratio: 515 / 320;
position: relative;
overflow: hidden;
z-index: 2;
}
.blog-list .image_wrap img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
transition: transform 0.5s ease;
}
.blog-list .b-box:hover .image_wrap img {
width: 100%;
height: 100%;
will-change: transform;
transition: transform 0.5s ease;
transform: scale(1.2);
}
@media screen and (max-width: 768px) {
.mv-area {
height: 89vh;
padding: 3em 1em;
margin: 61px auto 0;
}
.mv-area .mv-slider2 {
bottom: 12px;
margin-top: 0;
}
.mv-area .mv-inner{
display: block;
}
.mv-area .mv-inner .logo-box {
width: 100%;
}
.mv-area .mv-slider{
width: 45%;
margin: 1em auto 0;
}
.top-about-area .c-ttl{
font-size: 2.3rem;
}
.top-about-area .c-ttl img{
display: block;
max-width: 80%;
margin: 0.5em auto;
}
.top-about-area p{
font-size: 1.4rem;
}
.top-about-area {
padding: 6em 0 5em;
}
.top-service-area .s-inner{
display: block;
padding-left: 0;
height: auto;
}
.top-service-area .service-desc {
width: 100%;
top: 0;
height: auto;
display: block;
padding: 0 1em;
}
.top-service-area .service-desc p {
margin-top: 1.5em;
line-height: 1.8;
font-size: 1.4rem;
}
.top-service-area .cp-wrap {
width: 100%;
padding: 0 1em;
margin-top: 2em;
}
.top-service-area .characteristic-plan{
width: 100%;
display: block;
}
.top-service-area {
padding: 4em 0 3em;
}
.top-service-area .characteristic-plan .c-box .character-ttl {
font-size: 2.2rem;
margin: 1.3em 0 1.3em;
}
.top-service-area .characteristic-plan .c-box {
margin-right: 0;
margin-bottom: 1em;
border-radius: 20px;
padding: 2em 1em 2em;
box-sizing: border-box;
display: block;
width: 100%;
}
.top-service-area .characteristic-plan .c-box .character-desc {
padding-top: 1em;
line-height:1.6
}
.top-service-area .characteristic-plan .c-box .c-name img {
display: block;
margin: 0 auto;
max-width: 70%;
}
.top-works-area {
}
.top-plan-area p {
line-height: 1.8;
font-size: 1.4rem;
}
.top-plan-area {
padding: 5em 0 5em;
}
.top-plan-area .plan-list {
display: block;
margin-top: 3em;
}
.top-plan-area .plan-list .plan-box {
padding: 2.5em 1.4em 2em;
width: 100%;
margin-bottom: 2em;
}
.top-plan-area .plan-list .plan-box .plan-name {
font-size: 3.3rem;
letter-spacing: 0;
}
.top-plan-area .plan-list .plan-box .plan-name .small {
font-size: 1.4rem;
}
.top-plan-area .plan-list .plan-box .desc-list .point {
font-size: 1.4rem;
padding-left: 1em;
letter-spacing: 0;
}
.top-plan-area .plan-list .plan-box .reccommend {
font-size: 1.4rem;
}
.top-plan-area .plan-list .plan-box .reccommend {
top: -15px;
}
.top-plan-area .last-catch {
margin-top: 3em;
}
.top-plan-area .plan-list .plan-box .desc-list .point::before {
top: .5em;
left: 0;
width: 10px;
height: 6px;
border-left: 2px solid #1EB05D;
border-bottom: 2px solid #1EB05D;
transform: rotate(-45deg);
}
.top-works-area {
padding: 5em 0 2em;
}
.top-works-area p {
font-size: 1.4rem;
margin: 1em 0 3em;
}
.case_study_list .title_area {
padding: 1.5em 1em;
}
.case_study_list .title_area .title {
font-size: 1.8rem;
}
.case_study_list .meta li{
font-size: 1.4rem;
}
.top-blog-area {
padding: 4em 0 5em;
}
.blog-list{
display: block;
}
.blog-list .b-box {
display: block;
width: 100%;
margin-bottom: 1.3em;
}
.top-blog-area .btn{
margin: 0 auto;
}
} .p-blog .page-ttl{
}
.p-blog .archive-wrap{
padding: 0 0 8em;
}
.blog-wrapper{
display: flex;
justify-content: space-between;
margin-top: 4em;
}
.blog-wrapper .b-left{
width: 19%;
}
.blog-wrapper .b-right{
width: 71%;
}
.s-blog-list li{
width: 100%;
}
.s-blog-list li a{
color: #000;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #C9C9C9;
padding: 1.5em 1em;
}
.s-blog-list li a .img-box{
margin: 0.8em 0 0.8em;
width: 20%;
}
.s-blog-list li a .text-box{
width: 73%;
padding-top: 2.8em;
}
.s-blog-list li a .text-box .date-wrapper{
display: flex;
align-items: center;
margin-bottom: 1em;
}
.s-blog-list li a .text-box .blog-ttl{
font-weight: bold;
font-size: 1.8rem;
}
.s-blog-list.voice li a .text-box .blog-ttl{
font-weight: 400;
}
.s-blog-list li a .text-box .blog-text{
margin-top: 1em;
}
.s-blog-list li a .text-box .date-wrapper .blog-date{
margin-right: 1em;
margin-bottom: 0;
}
.s-blog-list li a .text-box .date-wrapper .cat-wrap{
display: flex;
align-items: center;
}
.s-blog-list li a .img-box figure {
margin: 0 0 1em;
width: 100%;
padding-top: 99.14%;
overflow: hidden;
position: relative;
}
.s-blog-list li a .img-box figure img{
max-width: initial;
width: 100%;
height: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}
.blog-date{
font-size: 1.4rem;
margin: 0em 0 0.5em;
}
.s-blog-list li a .readmore{
color: #35575F;
font-size: 1.2rem;
border-bottom: 1px solid #35575F;
position: relative;
padding: 1em 0;
}
.s-blog-list li a .readmore:after{
content: "";
position: absolute;
top: auto;
bottom: -1px;
width: 0;
height: 2px;
display: block;
background: #0F3A44;
z-index: -1;
transition: .5s;
}
.s-blog-list li a:hover .readmore:after{
width: 100%;
z-index: 2;
}
.s-blog-list li a:hover .readmore::before{
right: 20px;
}
.s-blog-list li a figure{
overflow: hidden;
}
.s-blog-list li a figure img{
display: block;
transition-duration: 0.5s;
width: 100%;
}
.s-blog-list li a:hover figure img{
width: 103%;
transition-duration: 0.5s;
}
.cat-block{
font-size: 1.2rem;
margin-right: 10px;
padding: 2px 5px;
border: 1px solid #000;
background-color: #fff;
display: table;
}
.cat-block:last-child{
margin-right: 0px;
}
.blog-wrapper .works-list{
display: flex;
flex-wrap: wrap;
}
.blog-wrapper .works-list .case_study_list{
width: 50%;
} .blog-wrapper .side-box{
margin-bottom: 4em;
}
.blog-wrapper .side-box.banner-box a{
display: block;
margin-bottom: 5px;
}
.blog-wrapper .side-box.banner-box a:last-child{
margin-bottom: 0;
}
.blog-wrapper .side-box:last-child{
margin-bottom: 0em;
}
.blog-wrapper .side-box .side-ttl{
border-bottom: 1px solid #909E9F;
padding: 0 0 0.8em 0.5em;
font-size: 0.8em;
margin-bottom: 1em;
font-size: 2rem;
position: relative;
}
.blog-wrapper .side-box .side-ttl .en{
font-size: 1.2rem;
margin-left: 10px;
}
.blog-wrapper .side-t-box li{
margin-bottom: 1em;
}
.blog-wrapper .side-t-box li:last-child{
margin-bottom: 0;
}
.blog-wrapper .side-t-box li a{
display: flex;
justify-content: space-between;
color: #000;
border: 1px solid #E6E6E6;
padding: 0.7em 0.7em;
position: relative;
}
.blog-wrapper .side-t-box li a:hover::before{
right: 2px;
}
.blog-wrapper .side-t-box li a .cat-block{
font-size: 1.2rem;
}
.blog-wrapper .side-t-box li a figure{
margin-bottom: 0;
height: 90px;
overflow: hidden;
position: relative;
width: 26%;
}
.blog-wrapper .side-t-box li a figure img{
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
max-width: initial;
width: auto;
height: 100%;
}
.blog-wrapper .side-t-box li a .detail-block{
width: 69%;
}
.blog-wrapper .side-t-box li a .detail-block .date-wrap{
display: flex;
margin-bottom: 10px;
}
.blog-wrapper .side-t-box li a .detail-block .date-wrap .blog-date{
margin-right: 10px;
margin-bottom: 0;
}
.blog-wrapper .side-box .t-archive{
width: 100%;
position: relative;
margin-top: 0.8em;
}
.blog-wrapper .side-box .t-archive select{
width: 100%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
font-weight: 400;
font-size: 1.4rem;
letter-spacing: 0.1em;
line-height: 1.95556;
width: 100%;
display: block;
border: none;
padding: 6px 15px 6px 15px;
position: relative;
border: 1px solid #DCDCDC;
border-radius: 3px;
}
.blog-wrapper .side-box .t-archive:after {
content: '';
position: absolute;
top: 23px;
right: 24px;
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/arrow_down.svg) no-repeat;
width: 11px;
height: 7px;
background-size: cover;
position: absolute;
transform: translate(0,-50%);
}
.blog-wrapper .side-box .side-category li a{
display: block;
color: #000;
font-size: 1.6rem;
position: relative;
padding: 0.4em 0 0.4em 2em;
font-weight: bold;
}
@media screen and (max-width: 1200px) {
.p-blog .blog-wrapper .b-right {
width: 66%;
padding: 0 0em;
}
}
@media screen and (max-width: 767px) {
.p-blog .blog-tab-wrap .b-tab{
font-size: 1.3rem;
}
.cat-block {
font-size: 1.2rem;
}
.blog-wrapper .works-list{
display: block;
}
.s-blog-list li a .img-box {
margin: 0.3em 0 0.5em;
}
.p-blog .blog-wrapper {
display: block;
padding: 0;
}
.p-blog .blog-wrapper .b-right {
width: 100%;
padding: 0;
}
.p-blog .blog-wrapper .b-left {
width: 100%;
padding-top: 0em;
margin-top: 3em;
}
.blog-wrapper .works-list .case_study_list{
width: 100%;
}
.s-blog-list li {
width: 100%;
}
.s-blog-list li a{
padding: 1em 0.3em;
}
.s-blog-list li a .text-box{
padding-top: 0;
width: 75%;
}
.s-blog-list li a .text-box .date-wrapper{
margin-bottom: 0.3em;
}
.s-blog-list li a .text-box .blog-ttl {
font-size: 1.4rem;
}
.blog-wrapper .side-box {
margin-bottom: 2em;
}
.blog-wrapper .side-box .side-ttl {
font-size: 1.6rem;
}
.blog-wrapper .side-box .side-category li a{
font-size: 1.4rem;
}
} .p-single .blog-area{
padding: 5em 0px 9em;
}
.kiji-wrap .blog-date-wrap{
display: flex;
margin-bottom: 1em;
}
.kiji-wrap .blog-date-wrap .blog-date{
margin-right: 20px;
}
.kiji-wrap{
max-width: 1200px;
width: 100%;
margin: 0 auto 4em;
display: block;
}
.kiji-wrap .wp-block-image{
margin: 1.5em 0;
}
.kiji-wrap .wp-block-image img{
display: block;
margin: 0 auto;
}
.kiji-wrap h1{
text-align: left;
position: relative;
font-size: 2.5rem;
font-weight: bold;
}
.kiji-wrap .eyecatch{
z-index: 1;
position: relative;
margin: 3em 0;
}
.kiji-wrap .eyecatch img{
display: block;
margin:0 auto;
height: auto;
}
.kiji-wrap .voice-detail{
display: flex;
justify-content: center;
margin: 0 0 2em;
}
.kiji-wrap .voice-detail .vd-box{
width: 33.33%;
border-left: 1px solid #03172A;
border-bottom: 1px solid #03172A;
}
.kiji-wrap .voice-detail .vd-box:last-child{
border-right: 1px solid #03172A;
}
.kiji-wrap .voice-detail .vd-box .vd-ttl{
background-color: #03172A;
color: #fff;
text-align: center;
padding: 0.8em 1em;
font-size: 1.6rem;
border-right: 1px solid #fff;
}
.kiji-wrap .voice-detail .vd-box .vd-txt{
padding: 1em 1em;
border-right: 1px solid #03172A;
}
.kiji-wrap .voice-detail .vd-box:last-child .vd-txt{
border-right: none;
}
.kiji-wrap .voice-detail .vd-box .vd-txt .txt{
display: table;
margin: 0 auto;
}
.kiji-wrap .voice-detail .vd-box:last-child .vd-ttl{
border-right:none;
}
.kiji-wrap .kiji-box {
padding: 0px 0 0;
overflow: hidden;
}
.kiji-wrap .kiji-box p{
margin: 1.5em 0;
}
.kiji-wrap .kiji-box h2{
padding: 1em 0.8em;
border-bottom: 2px solid #1B8E3E;
border-top: 2px solid #1B8E3E;
font-size: 2.2rem;
line-height: 1;
margin-bottom: 1em;
margin-top: 2em;
font-weight:bold;
position: relative;
}
.kiji-wrap .kiji-box h2::before{
content: '';
width: 100%;
height: 1px;
top: 2px;
left: 0;
position: absolute;
background-color: #1B8E3E;
}
.kiji-wrap .kiji-box h2::after{
content: '';
width: 100%;
height: 1px;
bottom: 2px;
left: 0;
position: absolute;
background-color: #1B8E3E;
}
.kiji-wrap .kiji-box h3{
padding: 0.5em 0.8em;
border-bottom: 1px solid #1B8E3E;;
font-size: 2rem;
line-height: 2.2;
margin-bottom: 1em;
margin-top: 2em;
font-weight: bold;
}
.kiji-wrap .kiji-box h4{
font-size: 1.8rem;
line-height: 1.4;
padding-left: 1em;
margin-bottom: 1em;
margin-top: 2em;
position: relative;
display: block;
border-left: 1px solid #1B8E3E;
font-weight: 500;
}
.kiji-wrap .kiji-box img.aligncenter{
display: block;
margin: 1em auto;
} 
.kiji-wrap .kiji-box a{
color: #000;
text-decoration: underline;
}
.kiji-wrap .kiji-box a:hover{
text-decoration: none;
}
.kiji-wrap .kiji-box ol{
padding-left: 1.8em;
margin-bottom: 0.5em!important;
}
.kiji-wrap .kiji-box ol li{
list-style-type:decimal!important;
}
.kiji-wrap .kiji-box ul{
padding-left: 1.8em;
margin-bottom: 0.5em!important;
}
.kiji-wrap .kiji-box ul li{
list-style-type: disc!important;
}
.kiji-wrap .data-list{
background-color: #f4f4f4;
padding: 2em 2em;
max-width: 800px;
width: 100%;
margin: 0 auto;
}
.kiji-wrap .data-list dl{
display: flex;
justify-content: center;
margin-bottom: 1em;
}
.kiji-wrap .data-list dl:last-child{
margin-bottom: 0;
}
.kiji-wrap .data-list dl dt{
width: 40%;
font-weight: bold;
}
.kiji-wrap .data-list dl dd{
width: 40%;
}
.p-blog .related-series{
background-color: #DBD5CD;
padding: 4em 0 3em;
}
.p-blog .related-wrap{
max-width: 95%;
width: 100%;
margin: 4em 0 0 auto;
}
.p-blog .related-wrap .s-blog-list{
display: block;
}
@media screen and (max-width: 767px) {
.kiji-wrap .blog-date-wrap {
margin-top: 0.5em;
}
.kiji-wrap h1 {
font-size: 2rem;
}
.kiji-wrap .kiji-box h2 {
padding: 1em 1.3em 1em;
font-size: 1.8rem;
}
.kiji-wrap .kiji-box h3 {
font-size: 1.6rem;
}
.kiji-wrap .kiji-box h4 {
font-size: 1.6rem;
line-height: 1.4;
padding-left: 1em;
margin-bottom: 0.5em;
margin-top: 1em;
font-weight: 500;
}
.p-blog .archive-wrap {
padding: 0 0 3em;
}
.p-blog .blog-tab-wrap {
margin-bottom: 3em;
}
.p-single .blog-area {
padding: 0em 0px 5em;
}
.p-blog .related-wrap {
max-width: 100%;
margin: 3em 0 0 auto;
} 
.kiji-wrap .voice-detail{
display: block;
}
.kiji-wrap .voice-detail .vd-box {
width: 100%;
}
.kiji-wrap .voice-detail .vd-box .vd-ttl {
padding: 0.5em 1em;
font-size: 1.4rem;
border-right: none;
}
.kiji-wrap .voice-detail .vd-box .vd-txt{
height: auto!important;
padding: 0.5em 1em;
}
.kiji-wrap .data-list dl{
display: block;
}
.kiji-wrap .data-list dl dt {
width: 100%;
}
.kiji-wrap .data-list dl dd {
width: 100%;
}
.kiji-wrap .data-list {
padding: 2em 1em;
}
} .page-id-9 .c-form{
max-width: 885px;
width: 100%;
margin: 0 auto;
}
.page-id-9 .contact-table{
border: none;
width: 100%;
}
.page-id-9 .contact-table th{
background-color: #fff;
text-align: left;
border: none;
vertical-align: top;
padding-top: 1.9em;
width: 268px;
}
.page-id-9 .contact-table td{
border: none;
padding: 1em 0 1em 2em;
}
.page-id-9 .contact-table th .req{
color: #1B8E3E;
border: 1px solid #1B8E3E;
display: inline-block;
padding: 0.3em 0.8em 0.2em;
text-align: center;
line-height: 1.4;
float: right;
font-size: 1.2rem;
}
.page-id-9 .contact-table input[type="email"], 
.page-id-9 .contact-table input[type="tel"], 
.page-id-9 .contact-table input[type="text"], 
.page-id-9 .contact-table textarea {
width: 100% !important;
background-color: #F6F6F6!important;
border: none!important;
padding: 1em 0.5em;
}
.page-id-9 .contact-table td select{
background-color: #F6F6F6!important;
padding: 1em 0.5em;
width: 100% !important;
border: none!important;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.page-id-9 .contact-table .t-archive{
position: relative;
padding: 0.5em 0em;
background-color: #F6F6F6!important;
padding: 0.3em 0.2em;
}
.page-id-9 .mw_wp_form_confirm .t-archive{
background-color: #fff!important;
}
.page-id-9 .contact-table .t-archive:after {
content: '';
position: absolute;
top: 50%;
right: 19px;
background: url(//webseisaku.site/cms/wp-content/themes/bam/images/common/arrow_down.svg) no-repeat;
width: 11px;
height: 7px;
background-size: cover;
position: absolute;
transform: translate(0, -50%);
}
.page-id-9 .mw_wp_form_confirm .t-archive:after{
content: none;
}
.page-id-9 .mw_wp_form_confirm .button-wrap{
display: flex;
justify-content: space-between;
}
.page-id-9 .mw_wp_form_confirm .button-wrap button{
max-width: 250px;
width: 100%;
}
.page-id-9 .mw_wp_form_confirm .button-wrap .button02{
color: #000;
border: 2px solid #000;
}
.page-id-9 .mw_wp_form_confirm .button-wrap .button02:hover{
color: #fff;
background-color: #000;
}
.page-id-9 .button-wrap {
margin-top: 3em;
}
.page-id-9 input[type="submit"] {
width: 100%;
max-width: 220px;
font-size: 15px;
color: #fff;
display: inline-block;
padding: 15px 0px;
text-align: center;
background-color: #1B8E3E;
border: 1px solid #1B8E3E;
border-radius: 50px;
text-decoration: none;
cursor: pointer;
transition: background-color 1s;
margin: 0 auto;
display: table;
} .page-id-9 input[type="submit"]:hover {
color: #1B8E3E;
background-color: #ffffff;
border: 1px solid #1B8E3E;
border-radius: 50px;
cursor: pointer;
transition: background-color 1s;
}
@media screen and (max-width: 768px) {
.page-id-9 .flow-area .flow-group .img-group .wp-block-group__inner-container {
justify-content: flex-start;
}
.page-id-9 .flow-area .flow-group h3 {
font-size: 19px;
}
.page-id-9 .flow-area .flow-group .img-group .wp-block-group__inner-container figure {
width: 31%;
margin-right: 1em;
}
.page-id-9 .flow-area .flow-group .wp-block-column:before {
top: auto;
right: auto;
left: 50%;
transform: translate(-50%, 0px) rotate(90deg);
bottom: -19px;
}
.page-id-9 .contact-table tbody,
.page-id-9 .contact-table tr,
.page-id-9 .contact-table th,
.page-id-9 .contact-table td {
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;
padding: 8px 0;
}
.page-id-9 .mw_wp_form_confirm .button-wrap button {
max-width: 174px;
width: 100%;
padding: 1rem 1rem;
}
.page-id-9 .flow-area {
margin-bottom: 5em;
}
}  html body.single-post main.p-single {
--bam-blog-ink: #073f33;
--bam-blog-green: #0b7a58;
--bam-blog-green-dark: #07553f;
--bam-blog-mint: #edf7f2;
--bam-blog-mint-soft: #f7fbf9;
--bam-blog-line: #cfe2da;
--bam-blog-paper: #fffdfa;
--bam-blog-text: #273832;
--bam-blog-muted: #5c6e67;
background: #f5f8f6;
color: var(--bam-blog-text);
} html body.single-post main.p-single .page-ttl.news {
position: relative;
overflow: hidden;
padding: 62px 0 54px !important;
border-bottom: 1px solid rgba(11, 122, 88, .12);
background:
radial-gradient(circle at 88% 14%, rgba(11, 122, 88, .12) 0 90px, transparent 91px),
linear-gradient(135deg, #f9fcfa 0%, #eef7f2 100%);
}
html body.single-post main.p-single .page-ttl.news .inner2 {
max-width: 1240px;
padding-right: 32px;
padding-left: 32px;
}
html body.single-post main.p-single .page-ttl.news .pt-heading {
color: var(--bam-blog-ink);
}
html body.single-post main.p-single .page-ttl.news .pt-heading > .bg-wrap:first-child {
display: block;
margin-bottom: 8px;
color: var(--bam-blog-green);
font-size: 13px;
font-weight: 800;
line-height: 1.4;
letter-spacing: .14em;
text-transform: uppercase;
}
html body.single-post main.p-single .page-ttl.news .pt-heading > .bg-wrap:last-child {
display: block;
font-size: clamp(34px, 4vw, 48px);
font-weight: 900;
line-height: 1.25;
letter-spacing: -.035em;
}
html body.single-post main.p-single .c-breadcrumb {
padding: 0 !important;
border-bottom: 1px solid #e3ece7;
background: #fff;
}
html body.single-post main.p-single .c-breadcrumb ul {
box-sizing: border-box;
width: 100%;
max-width: 1240px;
margin: 0 auto;
padding: 15px 32px !important;
justify-content: flex-start !important;
}
html body.single-post main.p-single .c-breadcrumb ul li,
html body.single-post main.p-single .c-breadcrumb ul li a {
color: #5c6b65;
} html body.single-post main.p-single .blog-area.archive-wrap {
padding: 48px 0 100px !important;
background: #f5f8f6;
}
html body.single-post main.p-single .blog-area.archive-wrap > .inner2 {
max-width: 1240px;
padding-right: 28px;
padding-left: 28px;
}
html body.single-post main.p-single .blog-wrapper {
display: grid !important;
grid-template-columns: minmax(0, 850px) minmax(245px, 1fr);
align-items: start;
gap: clamp(30px, 4vw, 52px);
margin-top: 0 !important;
}
html body.single-post main.p-single .blog-wrapper .b-right,
html body.single-post main.p-single .blog-wrapper .b-left {
width: 100% !important;
min-width: 0;
padding: 0 !important;
}
html body.single-post main.p-single .single-kiji {
overflow: hidden;
border: 1px solid rgba(7, 63, 51, .08);
border-radius: 26px;
background: var(--bam-blog-paper);
box-shadow: 0 18px 60px rgba(7, 63, 51, .075);
}
html body.single-post main.p-single .kiji-wrap {
box-sizing: border-box;
width: 100%;
max-width: none;
margin: 0 !important;
padding: clamp(36px, 5vw, 58px) clamp(34px, 5vw, 62px) clamp(52px, 6vw, 76px);
} html body.single-post main.p-single .kiji-wrap .blog-date-wrap {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 9px 12px;
margin: 0 0 18px !important;
color: var(--bam-blog-muted);
}
html body.single-post main.p-single .kiji-wrap .blog-date-wrap .blog-date {
margin: 0 !important;
color: var(--bam-blog-muted);
font-size: 13px;
font-variant-numeric: tabular-nums;
letter-spacing: .035em;
}
html body.single-post main.p-single .kiji-wrap .cat-wrap {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 7px;
}
html body.single-post main.p-single .kiji-wrap .cat-wrap .cat-block {
display: inline-flex;
align-items: center;
width: auto;
min-height: 28px;
margin: 0;
padding: 5px 10px;
border: 1px solid #b7d8ca;
border-radius: 999px;
background: var(--bam-blog-mint);
color: var(--bam-blog-green-dark);
font-size: 12px;
font-weight: 700;
line-height: 1.2;
}
html body.single-post main.p-single .kiji-wrap h1.ttl {
max-width: 780px;
margin: 0;
color: var(--bam-blog-ink);
font-size: clamp(32px, 3.4vw, 44px);
font-weight: 900;
line-height: 1.38;
letter-spacing: -.035em;
text-wrap: pretty;
}
html body.single-post main.p-single .kiji-wrap .eyecatch {
overflow: hidden;
margin: 38px 0 42px !important;
border-radius: 22px;
background: #e8f1ec;
box-shadow: 0 14px 38px rgba(7, 63, 51, .10);
}
html body.single-post main.p-single .kiji-wrap .eyecatch img {
display: block;
width: 100%;
height: auto;
margin: 0;
} html body.single-post main.p-single .kiji-wrap .kiji-box {
overflow: visible !important;
color: var(--bam-blog-text);
font-size: 17px;
line-height: 1.95;
letter-spacing: .01em;
}
html body.single-post main.p-single .kiji-wrap .kiji-box > p:first-child {
margin-top: 0;
padding: 22px 24px;
border-left: 5px solid var(--bam-blog-green);
border-radius: 0 14px 14px 0;
background: var(--bam-blog-mint-soft);
color: #173c30;
font-size: 18px;
font-weight: 650;
line-height: 1.85;
}
html body.single-post main.p-single .kiji-wrap .kiji-box p {
margin: 1.35em 0;
}
html body.single-post main.p-single .kiji-wrap .kiji-box strong {
color: var(--bam-blog-ink);
font-weight: 750;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h2 {
margin: 64px 0 24px !important;
padding: 22px 26px !important;
border: 0 !important;
border-left: 6px solid var(--bam-blog-green) !important;
border-radius: 14px;
background: linear-gradient(135deg, #edf7f2 0%, #f8fbf9 100%);
color: var(--bam-blog-ink);
font-size: clamp(25px, 2.4vw, 30px) !important;
font-weight: 850;
line-height: 1.48 !important;
letter-spacing: -.025em;
text-wrap: pretty;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h2::before,
html body.single-post main.p-single .kiji-wrap .kiji-box h2::after {
content: none !important;
display: none !important;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h3 {
position: relative;
margin: 46px 0 17px !important;
padding: 0 0 12px 18px !important;
border: 0 !important;
border-bottom: 0 !important;
color: var(--bam-blog-ink);
font-size: clamp(21px, 1.8vw, 24px) !important;
font-weight: 800;
line-height: 1.55 !important;
letter-spacing: -.018em;
text-wrap: pretty;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h3::before {
content: "";
position: absolute;
top: .25em;
bottom: calc(12px + .2em);
left: 0;
width: 4px;
border-radius: 999px;
background: var(--bam-blog-green);
}
html body.single-post main.p-single .kiji-wrap .kiji-box h4 {
margin: 38px 0 15px !important;
padding: 3px 0 3px 16px !important;
border: 0 !important;
border-left: 3px solid #65aa8d !important;
color: var(--bam-blog-ink);
font-size: 19px !important;
font-weight: 750;
line-height: 1.6 !important;
} html body.single-post main.p-single .kiji-wrap .kiji-box ul,
html body.single-post main.p-single .kiji-wrap .kiji-box ol {
margin: 24px 0 30px !important;
padding: 20px 24px 20px 50px !important;
border: 1px solid var(--bam-blog-line);
border-radius: 16px;
background: var(--bam-blog-mint-soft);
}
html body.single-post main.p-single .kiji-wrap .kiji-box li {
padding-left: .25em;
line-height: 1.78;
}
html body.single-post main.p-single .kiji-wrap .kiji-box li + li {
margin-top: .55em;
}
html body.single-post main.p-single .kiji-wrap .kiji-box li::marker {
color: var(--bam-blog-green);
font-weight: 800;
} html body.single-post main.p-single .kiji-wrap .kiji-box blockquote {
margin: 30px 0;
padding: 24px 28px;
border: 0;
border-left: 4px solid #caa359;
border-radius: 0 16px 16px 0;
background: #faf7ef;
color: #3f453f;
}
html body.single-post main.p-single .kiji-wrap .kiji-box blockquote > :first-child,
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template > :first-child {
margin-top: 0;
}
html body.single-post main.p-single .kiji-wrap .kiji-box blockquote > :last-child,
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template > :last-child {
margin-bottom: 0;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template {
margin: 30px 0;
padding: 26px 28px;
border: 2px solid #9fcdb9;
border-radius: 18px;
background: #f0f8f4;
box-shadow: 0 10px 28px rgba(7, 63, 51, .06);
}
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template p {
margin: 0 0 7px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template br {
display: block;
margin: 9px 0;
} html body.single-post main.p-single .kiji-wrap .kiji-box .table-scroll,
html body.single-post main.p-single .kiji-wrap .kiji-box .wp-block-table {
overflow-x: auto;
margin: 30px 0 36px;
border: 1px solid var(--bam-blog-line);
border-radius: 16px;
background: #fff;
box-shadow: 0 10px 28px rgba(7, 63, 51, .05);
-webkit-overflow-scrolling: touch;
}
html body.single-post main.p-single .kiji-wrap .kiji-box table {
width: 100%;
margin: 28px 0 34px;
border: 1px solid var(--bam-blog-line);
border-collapse: separate;
border-spacing: 0;
border-radius: 14px;
background: #fff;
font-size: 15px;
line-height: 1.7;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .table-scroll table,
html body.single-post main.p-single .kiji-wrap .kiji-box .wp-block-table table {
min-width: 680px;
margin: 0;
border: 0;
border-radius: 0;
}
html body.single-post main.p-single .kiji-wrap .kiji-box th,
html body.single-post main.p-single .kiji-wrap .kiji-box td {
padding: 15px 16px;
border: 0;
border-right: 1px solid var(--bam-blog-line);
border-bottom: 1px solid var(--bam-blog-line);
text-align: left;
vertical-align: top;
}
html body.single-post main.p-single .kiji-wrap .kiji-box th {
background: var(--bam-blog-ink);
color: #fff;
font-weight: 750;
}
html body.single-post main.p-single .kiji-wrap .kiji-box tbody tr:nth-child(even) td {
background: #f7fbf9;
}
html body.single-post main.p-single .kiji-wrap .kiji-box tr > :last-child {
border-right: 0;
}
html body.single-post main.p-single .kiji-wrap .kiji-box tbody tr:last-child td {
border-bottom: 0;
} html body.single-post main.p-single .kiji-wrap .kiji-box figure,
html body.single-post main.p-single .kiji-wrap .wp-block-image {
margin: 38px 0 42px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box figure img,
html body.single-post main.p-single .kiji-wrap .kiji-box img.aligncenter,
html body.single-post main.p-single .kiji-wrap .wp-block-image img {
display: block;
width: auto;
max-width: 100%;
height: auto;
margin-right: auto;
margin-left: auto;
border-radius: 18px;
box-shadow: 0 14px 36px rgba(7, 63, 51, .09);
}
html body.single-post main.p-single .kiji-wrap .kiji-box figcaption,
html body.single-post main.p-single .kiji-wrap .wp-element-caption {
margin-top: 11px;
color: var(--bam-blog-muted);
font-size: 13px;
line-height: 1.65;
text-align: left;
} html body.single-post main.p-single .kiji-wrap .kiji-box a {
color: #08744f !important;
text-decoration-color: rgba(8, 116, 79, .46) !important;
text-decoration-thickness: 1px;
text-underline-offset: 4px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box a:hover {
color: #045c3e !important;
text-decoration-color: currentColor !important;
}
html body.single-post main.p-single .kiji-wrap .kiji-box a:focus-visible,
html body.single-post main.p-single .blog-wrapper .b-left a:focus-visible {
outline: 3px solid rgba(11, 122, 88, .28);
outline-offset: 4px;
border-radius: 4px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box > p:has(a[href*="/contact/"]):last-child,
html body.single-post main.p-single .kiji-wrap .kiji-box .cta {
position: relative;
overflow: hidden;
margin: 58px 0 0;
padding: 30px 32px;
border-radius: 20px;
background: var(--bam-blog-ink);
color: #fff;
box-shadow: 0 18px 42px rgba(7, 63, 51, .16);
}
html body.single-post main.p-single .kiji-wrap .kiji-box > p:has(a[href*="/contact/"]):last-child a,
html body.single-post main.p-single .kiji-wrap .kiji-box .cta a {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 48px;
margin-top: 10px;
padding: 12px 22px;
border: 1px solid rgba(255, 255, 255, .58);
border-radius: 999px;
background: #fff;
color: var(--bam-blog-ink) !important;
font-weight: 800;
text-decoration: none !important;
} html body.single-post main.p-single .blog-wrapper .b-left {
position: sticky;
top: 92px;
}
html body.single-post main.p-single .blog-wrapper .side-box {
margin: 0 0 22px !important;
padding: 20px;
border: 1px solid rgba(7, 63, 51, .09);
border-radius: 18px;
background: #fff;
box-shadow: 0 12px 34px rgba(7, 63, 51, .055);
}
html body.single-post main.p-single .blog-wrapper .side-box .side-ttl {
margin: 0 0 15px;
padding: 0 0 12px;
border: 0;
border-bottom: 1px solid var(--bam-blog-line);
color: var(--bam-blog-ink);
font-size: 18px;
font-weight: 850;
line-height: 1.4;
}
html body.single-post main.p-single .blog-wrapper .side-box .side-ttl .en {
display: block;
margin: 4px 0 0;
color: var(--bam-blog-green);
font-size: 10px;
font-weight: 750;
line-height: 1.3;
letter-spacing: .12em;
text-transform: uppercase;
}
html body.single-post main.p-single .blog-wrapper .side-t-box li {
margin-bottom: 10px;
}
html body.single-post main.p-single .blog-wrapper .side-t-box li a {
padding: 9px;
border: 1px solid #e1ebe6;
border-radius: 12px;
background: #fff;
transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}
html body.single-post main.p-single .blog-wrapper .side-t-box li a:hover {
border-color: #aed3c3;
background: #f7fbf9;
transform: translateY(-1px);
}
html body.single-post main.p-single .blog-wrapper .side-category li a {
padding: 8px 12px 8px 24px;
border-radius: 9px;
color: #244138;
font-size: 14px;
line-height: 1.55;
}
html body.single-post main.p-single .blog-wrapper .side-category li a:hover {
background: var(--bam-blog-mint-soft);
color: var(--bam-blog-green-dark);
}
html body.single-post main.p-single .blog-wrapper .side-box .t-archive select {
min-height: 46px;
border-color: var(--bam-blog-line);
border-radius: 10px;
background: #fff;
}
@media (max-width: 1050px) {
html body.single-post main.p-single .blog-wrapper {
grid-template-columns: minmax(0, 1fr) 260px;
gap: 30px;
}
html body.single-post main.p-single .kiji-wrap {
padding-right: 38px;
padding-left: 38px;
}
}
@media (max-width: 820px) {
html body.single-post main.p-single .blog-wrapper {
display: block !important;
}
html body.single-post main.p-single .blog-wrapper .b-left {
position: static;
margin-top: 30px;
}
html body.single-post main.p-single .blog-wrapper .side-box {
max-width: 680px;
margin-right: auto !important;
margin-left: auto !important;
}
}
@media (max-width: 767px) {
html body.single-post main.p-single .page-ttl.news {
padding: 34px 0 30px !important;
background:
radial-gradient(circle at 94% 8%, rgba(11, 122, 88, .10) 0 56px, transparent 57px),
linear-gradient(135deg, #f9fcfa 0%, #eef7f2 100%);
}
html body.single-post main.p-single .page-ttl.news .inner2,
html body.single-post main.p-single .c-breadcrumb ul,
html body.single-post main.p-single .blog-area.archive-wrap > .inner2 {
padding-right: 16px !important;
padding-left: 16px !important;
}
html body.single-post main.p-single .page-ttl.news .pt-heading > .bg-wrap:first-child {
margin-bottom: 5px;
font-size: 11px;
}
html body.single-post main.p-single .page-ttl.news .pt-heading > .bg-wrap:last-child {
font-size: 30px;
line-height: 1.3;
}
html body.single-post main.p-single .c-breadcrumb ul {
flex-wrap: nowrap;
overflow-x: auto;
padding-top: 12px !important;
padding-bottom: 12px !important;
white-space: nowrap;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
html body.single-post main.p-single .c-breadcrumb ul::-webkit-scrollbar {
display: none;
}
html body.single-post main.p-single .c-breadcrumb ul li {
flex: 0 0 auto;
font-size: 11px;
}
html body.single-post main.p-single .blog-area.archive-wrap {
padding: 24px 0 64px !important;
}
html body.single-post main.p-single .single-kiji {
border-radius: 18px;
box-shadow: 0 12px 34px rgba(7, 63, 51, .065);
}
html body.single-post main.p-single .kiji-wrap {
padding: 25px 18px 44px;
}
html body.single-post main.p-single .kiji-wrap .blog-date-wrap {
margin-bottom: 14px !important;
}
html body.single-post main.p-single .kiji-wrap h1.ttl {
font-size: clamp(25px, 7.2vw, 30px);
line-height: 1.46;
letter-spacing: -.025em;
}
html body.single-post main.p-single .kiji-wrap .eyecatch {
margin: 26px 0 31px !important;
border-radius: 14px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box {
font-size: 16px;
line-height: 1.92;
}
html body.single-post main.p-single .kiji-wrap .kiji-box > p:first-child {
padding: 18px 18px;
border-left-width: 4px;
border-radius: 0 11px 11px 0;
font-size: 16.5px;
line-height: 1.86;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h2 {
margin-top: 50px !important;
padding: 18px 17px !important;
border-left-width: 5px !important;
border-radius: 12px;
font-size: clamp(22px, 6.2vw, 25px) !important;
line-height: 1.5 !important;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h3 {
margin-top: 39px !important;
padding-left: 15px !important;
font-size: clamp(19px, 5.3vw, 22px) !important;
}
html body.single-post main.p-single .kiji-wrap .kiji-box h4 {
margin-top: 32px !important;
font-size: 18px !important;
}
html body.single-post main.p-single .kiji-wrap .kiji-box ul,
html body.single-post main.p-single .kiji-wrap .kiji-box ol {
padding: 18px 16px 18px 39px !important;
border-radius: 13px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box blockquote,
html body.single-post main.p-single .kiji-wrap .kiji-box .memo-template {
padding: 20px 18px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .table-scroll,
html body.single-post main.p-single .kiji-wrap .kiji-box .wp-block-table {
width: calc(100% + 36px);
margin-right: -18px;
margin-left: -18px;
border-right: 0;
border-left: 0;
border-radius: 0;
box-shadow: none;
}
html body.single-post main.p-single .kiji-wrap .kiji-box > table {
display: block;
max-width: 100%;
overflow-x: auto;
white-space: normal;
-webkit-overflow-scrolling: touch;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .table-scroll table,
html body.single-post main.p-single .kiji-wrap .kiji-box .wp-block-table table {
min-width: 640px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box th,
html body.single-post main.p-single .kiji-wrap .kiji-box td {
padding: 13px 14px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box figure,
html body.single-post main.p-single .kiji-wrap .wp-block-image {
margin: 32px -4px 36px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box figure img,
html body.single-post main.p-single .kiji-wrap .kiji-box img.aligncenter,
html body.single-post main.p-single .kiji-wrap .wp-block-image img {
border-radius: 14px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box > p:has(a[href*="/contact/"]):last-child,
html body.single-post main.p-single .kiji-wrap .kiji-box .cta {
margin-top: 48px;
padding: 25px 21px;
border-radius: 16px;
}
html body.single-post main.p-single .blog-wrapper .b-left {
margin-top: 28px !important;
}
html body.single-post main.p-single .blog-wrapper .side-box {
padding: 19px;
border-radius: 15px;
}
}
@media (max-width: 374px) {
html body.single-post main.p-single .page-ttl.news .inner2,
html body.single-post main.p-single .c-breadcrumb ul,
html body.single-post main.p-single .blog-area.archive-wrap > .inner2 {
padding-right: 12px !important;
padding-left: 12px !important;
}
html body.single-post main.p-single .kiji-wrap {
padding-right: 15px;
padding-left: 15px;
}
html body.single-post main.p-single .kiji-wrap .kiji-box .table-scroll,
html body.single-post main.p-single .kiji-wrap .kiji-box .wp-block-table {
width: calc(100% + 30px);
margin-right: -15px;
margin-left: -15px;
}
}
@media (prefers-reduced-motion: reduce) {
html body.single-post main.p-single *,
html body.single-post main.p-single *::before,
html body.single-post main.p-single *::after {
scroll-behavior: auto !important;
transition-duration: .01ms !important;
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
}
}  html body.category main.p-blog {
--bam-ink: #063b32;
--bam-green: #078057;
--bam-green-dark: #055f43;
--bam-mint: #eaf7f0;
--bam-line: #cfe1d9;
--bam-paper: #fffef9;
--bam-muted: #61716b;
background: #f5faf7;
color: var(--bam-ink);
}
html body.category main.p-blog .page-ttl.news {
min-height: 0;
padding: 62px 0 28px;
background: linear-gradient(180deg, #fffef9 0%, #f5faf7 100%);
}
html body.category main.p-blog .page-ttl.news .inner2 {
width: min(1220px, calc(100% - 64px));
margin: 0 auto;
}
html body.category main.p-blog .page-ttl.news h1 {
margin: 0;
color: var(--bam-ink);
font-size: clamp(38px, 5vw, 70px);
line-height: 1.05;
letter-spacing: -.04em;
}
html body.category main.p-blog .page-ttl.news h1 .en {
display: block;
margin-top: 10px;
color: var(--bam-green);
font-size: 13px;
font-weight: 800;
letter-spacing: .16em;
text-transform: uppercase;
}
html body.category main.p-blog .c-breadcrumb.white {
margin: 0;
padding: 16px 0;
border-top: 1px solid rgba(7, 128, 87, .12);
border-bottom: 1px solid var(--bam-line);
background: rgba(255, 254, 249, .92);
}
html body.category main.p-blog .c-breadcrumb ul {
width: min(1220px, calc(100% - 64px));
margin: 0 auto;
padding: 0;
}
html body.category main.p-blog .blog-area.archive-wrap {
padding: 48px 0 96px;
background: transparent;
}
html body.category main.p-blog .blog-area.archive-wrap > .inner2 {
display: block;
width: min(1220px, calc(100% - 64px));
margin: 0 auto;
padding: 0;
}
html body.category main.p-blog .blog-area.archive-wrap .blog-wrapper {
display: grid;
grid-template-columns: minmax(0, 1fr) 300px;
gap: 44px;
width: 100%;
margin: 0 !important;
}
html body.category main.p-blog .blog-area .b-right,
html body.category main.p-blog .blog-area .b-left {
float: none;
width: auto;
min-width: 0;
margin: 0;
}
html body.category main.p-blog .bam-category-summary {
position: relative;
overflow: hidden;
margin: 0 0 24px;
padding: 34px 38px 30px;
border: 1px solid var(--bam-line);
border-radius: 24px;
background:
radial-gradient(circle at 93% 15%, rgba(72, 181, 128, .18), transparent 32%),
var(--bam-paper);
box-shadow: 0 16px 42px rgba(6, 59, 50, .07);
}
html body.category main.p-blog .bam-category-summary::after {
position: absolute;
top: 27px;
right: 31px;
width: 52px;
height: 52px;
border: 1px solid rgba(7, 128, 87, .23);
border-radius: 50%;
content: "";
}
html body.category main.p-blog .bam-category-summary__eyebrow {
margin: 0 0 10px;
color: var(--bam-green);
font-size: 12px;
font-weight: 800;
letter-spacing: .18em;
}
html body.category main.p-blog .bam-category-summary h2 {
position: relative;
z-index: 1;
margin: 0 0 12px;
color: var(--bam-ink);
font-size: clamp(28px, 3.5vw, 44px);
line-height: 1.2;
letter-spacing: -.03em;
}
html body.category main.p-blog .bam-category-summary__lead {
max-width: 690px;
margin: 0;
color: #41534d;
font-size: 15px;
line-height: 1.85;
}
html body.category main.p-blog .bam-category-chips {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 24px 0 0;
padding: 20px 0 0;
border-top: 1px solid var(--bam-line);
}
html body.category main.p-blog .bam-category-chips a {
display: inline-flex;
align-items: center;
min-height: 40px;
padding: 8px 14px;
border: 1px solid var(--bam-line);
border-radius: 999px;
background: #fff;
color: var(--bam-ink);
font-size: 13px;
font-weight: 700;
line-height: 1.25;
text-decoration: none;
transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease;
}
html body.category main.p-blog .bam-category-chips a:hover,
html body.category main.p-blog .bam-category-chips a:focus-visible {
border-color: var(--bam-green);
color: var(--bam-green-dark);
transform: translateY(-1px);
}
html body.category main.p-blog .bam-category-chips a[aria-current="page"] {
border-color: var(--bam-green);
background: var(--bam-green);
color: #fff;
}
html body.category main.p-blog .s-blog-list {
display: grid;
gap: 18px;
margin: 0;
padding: 0;
}
html body.category main.p-blog .s-blog-list > li {
overflow: hidden;
margin: 0;
border: 1px solid var(--bam-line);
border-radius: 20px;
background: var(--bam-paper);
box-shadow: 0 10px 30px rgba(6, 59, 50, .05);
transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
html body.category main.p-blog .s-blog-list > li:hover,
html body.category main.p-blog .s-blog-list > li:focus-within {
border-color: rgba(7, 128, 87, .55);
box-shadow: 0 16px 34px rgba(6, 59, 50, .1);
transform: translateY(-2px);
}
html body.category main.p-blog .s-blog-list > li > a {
display: grid;
grid-template-columns: 255px minmax(0, 1fr);
min-height: 210px;
color: inherit;
text-decoration: none;
}
html body.category main.p-blog .s-blog-list .img-box,
html body.category main.p-blog .s-blog-list .img-box figure {
width: 100%;
height: 100%;
margin: 0;
}
html body.category main.p-blog .s-blog-list .img-box {
min-height: 210px;
background: var(--bam-mint);
}
html body.category main.p-blog .s-blog-list .img-box img {
display: block;
width: 100%;
height: 100%;
min-height: 210px;
object-fit: cover;
transition: transform .35s ease;
}
html body.category main.p-blog .s-blog-list > li:hover .img-box img {
transform: scale(1.025);
}
html body.category main.p-blog .s-blog-list .text-box {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
padding: 27px 31px 25px;
}
html body.category main.p-blog .s-blog-list .date-wrapper {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 9px;
margin: 0 0 12px;
}
html body.category main.p-blog .s-blog-list .blog-date {
color: var(--bam-muted);
font-size: 12px;
font-weight: 700;
letter-spacing: .05em;
}
html body.category main.p-blog .s-blog-list .cat-wrap {
height: auto !important;
}
html body.category main.p-blog .s-blog-list .cat-block {
display: inline-flex;
align-items: center;
min-height: 27px;
padding: 5px 10px;
border: 0;
border-radius: 999px;
background: var(--bam-mint);
color: var(--bam-green-dark);
font-size: 11px;
font-weight: 800;
line-height: 1.2;
}
html body.category main.p-blog .s-blog-list .blog-ttl {
margin: 0 0 11px;
color: var(--bam-ink);
font-size: clamp(18px, 1.7vw, 23px);
font-weight: 800;
line-height: 1.5;
letter-spacing: -.015em;
}
html body.category main.p-blog .s-blog-list .blog-text {
display: -webkit-box;
overflow: hidden;
margin: 0;
color: #51615c;
font-size: 14px;
line-height: 1.8;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
html body.category main.p-blog .wp-pagenavi {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 9px;
margin: 34px 0 0;
padding: 0;
border: 0;
text-align: center;
}
html body.category main.p-blog .wp-pagenavi a,
html body.category main.p-blog .wp-pagenavi span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 44px;
margin: 0;
padding: 9px 13px;
border: 1px solid var(--bam-line);
border-radius: 999px;
background: #fff;
color: var(--bam-ink);
font-size: 13px;
font-weight: 800;
line-height: 1;
text-decoration: none;
}
html body.category main.p-blog .wp-pagenavi a:hover,
html body.category main.p-blog .wp-pagenavi a:focus-visible,
html body.category main.p-blog .wp-pagenavi .current {
border-color: var(--bam-green);
background: var(--bam-green);
color: #fff;
}
html body.category main.p-blog .blog-area .b-left {
display: flex;
flex-direction: column;
gap: 18px;
}
html body.category main.p-blog .blog-area .b-left .side-box {
margin: 0;
padding: 23px;
border: 1px solid var(--bam-line);
border-radius: 18px;
background: var(--bam-paper);
box-shadow: 0 10px 30px rgba(6, 59, 50, .045);
}
html body.category main.p-blog .blog-area .b-left .side-ttl {
margin: 0 0 17px;
padding: 0 0 13px;
border-bottom: 1px solid var(--bam-line);
color: var(--bam-ink);
font-size: 17px;
font-weight: 800;
line-height: 1.35;
}
html body.category main.p-blog .blog-area .b-left .side-ttl .en {
display: block;
margin-top: 4px;
color: var(--bam-green);
font-size: 10px;
font-weight: 800;
letter-spacing: .16em;
text-transform: uppercase;
}
html body.category main.p-blog .bam-category-nav {
order: -20;
}
html body.category main.p-blog .bam-category-nav .side-category {
display: grid;
gap: 5px;
margin: 0;
padding: 0;
}
html body.category main.p-blog .bam-category-nav .side-category li {
margin: 0;
padding: 0;
border: 0;
}
html body.category main.p-blog .bam-category-nav .side-category a {
position: relative;
display: flex;
align-items: center;
min-height: 43px;
padding: 9px 35px 9px 13px;
border: 1px solid transparent;
border-radius: 11px;
color: #29453d;
font-size: 13px;
font-weight: 700;
line-height: 1.35;
text-decoration: none;
transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
html body.category main.p-blog .bam-category-nav .side-category a::after {
position: absolute;
right: 14px;
color: var(--bam-green);
content: "→";
font-size: 14px;
}
html body.category main.p-blog .bam-category-nav .side-category a:hover,
html body.category main.p-blog .bam-category-nav .side-category a:focus-visible {
border-color: var(--bam-line);
background: var(--bam-mint);
color: var(--bam-green-dark);
}
html body.category main.p-blog .bam-category-nav .side-category a.is-current,
html body.category main.p-blog .bam-category-nav .side-category a[aria-current="page"] {
border-color: var(--bam-green);
background: var(--bam-green);
color: #fff;
}
html body.category main.p-blog .bam-category-nav .side-category a.is-current::after,
html body.category main.p-blog .bam-category-nav .side-category a[aria-current="page"]::after {
color: #fff;
}
html body.category main.p-blog .bam-blog-plan-side {
order: -10;
}
html body.category main.p-blog .bam-blog-plan-banners {
display: grid;
gap: 10px;
}
html body.category main.p-blog .bam-blog-plan-banner {
display: grid;
gap: 4px;
overflow: hidden;
height: auto !important;
min-height: 126px;
padding: 17px 17px 15px;
border: 1px solid var(--bam-line);
border-radius: 13px;
background: var(--bam-mint);
color: var(--bam-ink);
align-content: start;
aspect-ratio: auto !important;
place-content: start normal;
text-decoration: none;
transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
html body.category main.p-blog .bam-blog-plan-banner:hover,
html body.category main.p-blog .bam-blog-plan-banner:focus-visible {
border-color: var(--bam-green);
box-shadow: 0 9px 20px rgba(6, 59, 50, .08);
transform: translateY(-1px);
}
html body.category main.p-blog .bam-blog-plan-banner .plan-eyebrow {
color: var(--bam-green-dark);
font-size: 10px;
font-weight: 800;
}
html body.category main.p-blog .bam-blog-plan-banner .plan-title {
font-size: 15px;
font-weight: 800;
line-height: 1.35;
}
html body.category main.p-blog .bam-blog-plan-banner .plan-note {
color: #53645e;
font-size: 11px;
line-height: 1.55;
}
html body.category main.p-blog .side-t-box {
display: grid;
gap: 10px;
margin: 0;
padding: 0;
}
html body.category main.p-blog .side-t-box li {
margin: 0;
padding: 0;
border: 0;
}
html body.category main.p-blog .side-t-box li a {
display: grid;
grid-template-columns: 88px minmax(0, 1fr);
gap: 12px;
align-items: start;
min-height: 76px;
padding: 8px;
border: 1px solid transparent;
border-radius: 11px;
color: var(--bam-ink);
text-decoration: none;
transition: border-color .2s ease, background-color .2s ease;
}
html body.category main.p-blog .side-t-box .detail-block,
html body.category main.p-blog .side-t-box .upper-block {
width: 100%;
min-width: 0;
}
html body.category main.p-blog .side-t-box .topics-ttl {
display: -webkit-box;
overflow: hidden;
margin: 0 0 7px;
color: var(--bam-ink);
font-size: 12px;
font-weight: 700;
line-height: 1.55;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
html body.category main.p-blog .side-t-box .blog-date {
margin: 0 0 5px;
color: var(--bam-muted);
font-size: 10px;
line-height: 1.35;
}
html body.category main.p-blog .side-t-box .cat-block {
display: inline-flex;
width: auto;
margin: 0;
padding: 3px 7px;
border-radius: 999px;
background: var(--bam-mint);
color: var(--bam-green-dark);
font-size: 10px;
line-height: 1.3;
}
html body.category main.p-blog .side-t-box li a:hover,
html body.category main.p-blog .side-t-box li a:focus-visible {
border-color: var(--bam-line);
background: var(--bam-mint);
}
html body.category main.p-blog .side-t-box figure {
overflow: hidden;
width: 88px;
height: 62px;
margin: 0;
border-radius: 9px;
background: var(--bam-mint);
}
html body.category main.p-blog .side-t-box figure img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
html body.category main.p-blog .side-t-box .side-txt,
html body.category main.p-blog .side-t-box .text-box {
min-width: 0;
color: var(--bam-ink);
font-size: 12px;
font-weight: 700;
line-height: 1.55;
}
html body.category main.p-blog .t-archive select {
width: 100%;
min-height: 46px;
padding: 8px 38px 8px 13px;
border: 1px solid var(--bam-line);
border-radius: 11px;
background-color: #fff;
color: var(--bam-ink);
font-size: 13px;
}
@media (max-width: 1080px) {
html body.category main.p-blog .blog-area.archive-wrap .blog-wrapper {
grid-template-columns: minmax(0, 1fr) 270px;
gap: 28px;
}
html body.category main.p-blog .s-blog-list > li > a {
grid-template-columns: 220px minmax(0, 1fr);
}
}
@media (max-width: 820px) {
html body.category main.p-blog .page-ttl.news {
padding: 38px 0 20px;
}
html body.category main.p-blog .page-ttl.news .inner2,
html body.category main.p-blog .c-breadcrumb ul,
html body.category main.p-blog .blog-area.archive-wrap > .inner2 {
width: min(100% - 32px, 720px);
}
html body.category main.p-blog .blog-area.archive-wrap {
padding: 26px 0 72px;
}
html body.category main.p-blog .blog-area.archive-wrap > .inner2 {
display: block;
}
html body.category main.p-blog .blog-area.archive-wrap .blog-wrapper {
display: block;
}
html body.category main.p-blog .bam-category-summary {
margin-bottom: 18px;
padding: 25px 21px 22px;
border-radius: 18px;
}
html body.category main.p-blog .bam-category-summary::after {
top: 19px;
right: 18px;
width: 39px;
height: 39px;
}
html body.category main.p-blog .bam-category-summary__lead {
padding-right: 8px;
font-size: 14px;
line-height: 1.75;
}
html body.category main.p-blog .bam-category-chips {
flex-wrap: nowrap;
overflow-x: auto;
margin-right: -21px;
margin-left: -21px;
padding-right: 21px;
padding-left: 21px;
scroll-padding-left: 21px;
scrollbar-width: none;
}
html body.category main.p-blog .bam-category-chips::-webkit-scrollbar {
display: none;
}
html body.category main.p-blog .bam-category-chips a {
flex: 0 0 auto;
}
html body.category main.p-blog .s-blog-list > li {
border-radius: 17px;
}
html body.category main.p-blog .s-blog-list > li > a {
display: block;
min-height: 0;
}
html body.category main.p-blog .s-blog-list .img-box,
html body.category main.p-blog .s-blog-list .img-box img {
min-height: 0;
aspect-ratio: 1200 / 630;
}
html body.category main.p-blog .s-blog-list .text-box {
padding: 21px 20px 22px;
}
html body.category main.p-blog .s-blog-list .blog-ttl {
font-size: 18px;
}
html body.category main.p-blog .s-blog-list .blog-text {
font-size: 13px;
-webkit-line-clamp: 3;
}
html body.category main.p-blog .blog-area .b-left {
margin-top: 34px;
}
html body.category main.p-blog .bam-category-nav {
display: none;
}
html body.category main.p-blog .blog-area .b-left .side-box {
padding: 20px;
}
}
@media (max-width: 374px) {
html body.category main.p-blog .page-ttl.news .inner2,
html body.category main.p-blog .c-breadcrumb ul,
html body.category main.p-blog .blog-area.archive-wrap > .inner2 {
width: calc(100% - 24px);
}
html body.category main.p-blog .bam-category-summary {
padding-right: 18px;
padding-left: 18px;
}
html body.category main.p-blog .bam-category-chips {
margin-right: -18px;
margin-left: -18px;
padding-right: 18px;
padding-left: 18px;
}
}
@media (prefers-reduced-motion: reduce) {
html body.category main.p-blog *,
html body.category main.p-blog *::before,
html body.category main.p-blog *::after {
scroll-behavior: auto !important;
transition-duration: .01ms !important;
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
}
}   html body.blog main.p-blog,
html body.category main.p-blog,
html body.single-post main.p-single {
--bam-blog-shell-width: 1240px;
--bam-blog-shell-gutter: 32px;
--bam-blog-sidebar-width: 280px;
--bam-blog-column-gap: 40px;
}
html body.blog main.p-blog .blog-area.archive-wrap > .inner2,
html body.category main.p-blog .blog-area.archive-wrap > .inner2,
html body.single-post main.p-single .blog-area.archive-wrap > .inner2 {
box-sizing: border-box;
width: min(
var(--bam-blog-shell-width),
calc(100% - (var(--bam-blog-shell-gutter) * 2))
) !important;
max-width: none !important;
margin-right: auto !important;
margin-left: auto !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
html body.blog main.p-blog .blog-area.archive-wrap .blog-wrapper,
html body.category main.p-blog .blog-area.archive-wrap .blog-wrapper,
html body.single-post main.p-single .blog-area.archive-wrap .blog-wrapper {
display: grid !important;
grid-template-columns: minmax(0, 1fr) var(--bam-blog-sidebar-width) !important;
align-items: start !important;
gap: var(--bam-blog-column-gap) !important;
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
margin-right: auto !important;
margin-left: auto !important;
}
html body.blog main.p-blog .blog-wrapper > .b-right,
html body.blog main.p-blog .blog-wrapper > .b-left,
html body.category main.p-blog .blog-wrapper > .b-right,
html body.category main.p-blog .blog-wrapper > .b-left,
html body.single-post main.p-single .blog-wrapper > .b-right,
html body.single-post main.p-single .blog-wrapper > .b-left {
float: none !important;
box-sizing: border-box;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
margin-right: 0 !important;
margin-left: 0 !important;
}
html body.blog main.p-blog .blog-wrapper > .b-left,
html body.category main.p-blog .blog-wrapper > .b-left,
html body.single-post main.p-single .blog-wrapper > .b-left {
justify-self: stretch;
}
html body.blog main.p-blog .blog-wrapper > .b-left > *,
html body.category main.p-blog .blog-wrapper > .b-left > *,
html body.single-post main.p-single .blog-wrapper > .b-left > * {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
} html body.single-post main.p-single .single-kiji {
width: 100% !important;
max-width: none !important;
}
html body.single-post main.p-single .kiji-wrap {
max-width: none !important;
} html body.blog main.p-blog .bam-blog-topics,
html body.category main.p-blog .bam-category-summary,
html body.category main.p-blog .bam-category-chips {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
}
@media (max-width: 1080px) {
html body.blog main.p-blog,
html body.category main.p-blog,
html body.single-post main.p-single {
--bam-blog-shell-gutter: 24px;
--bam-blog-sidebar-width: 252px;
--bam-blog-column-gap: 28px;
}
}
@media (max-width: 980px) {
html body.blog main.p-blog,
html body.category main.p-blog,
html body.single-post main.p-single {
--bam-blog-shell-gutter: 24px;
--bam-blog-column-gap: 32px;
}
html body.blog main.p-blog .blog-area.archive-wrap .blog-wrapper,
html body.category main.p-blog .blog-area.archive-wrap .blog-wrapper,
html body.single-post main.p-single .blog-area.archive-wrap .blog-wrapper {
grid-template-columns: minmax(0, 1fr) !important;
} html body.blog main.p-blog .blog-wrapper > .b-left {
display: none !important;
} html body.category main.p-blog .blog-wrapper > .b-left,
html body.single-post main.p-single .blog-wrapper > .b-left {
display: block !important;
width: min(100%, 760px) !important;
margin-right: auto !important;
margin-left: auto !important;
}
}
@media (max-width: 767px) {
html body.blog main.p-blog,
html body.category main.p-blog,
html body.single-post main.p-single {
--bam-blog-shell-gutter: 16px;
--bam-blog-column-gap: 24px;
}
html body.single-post main.p-single .kiji-wrap {
padding-right: clamp(18px, 6vw, 28px) !important;
padding-left: clamp(18px, 6vw, 28px) !important;
}
}
@media (max-width: 374px) {
html body.blog main.p-blog,
html body.category main.p-blog,
html body.single-post main.p-single {
--bam-blog-shell-gutter: 12px;
}
}   html body.blog main.p-blog .blog-wrapper > .b-left {
align-self: start;
position: sticky;
top: 92px;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-box {
box-sizing: border-box;
margin: 0 0 22px !important;
padding: 20px !important;
border: 1px solid rgba(7, 63, 51, .09) !important;
border-radius: 18px !important;
background: #fff !important;
box-shadow: 0 12px 34px rgba(7, 63, 51, .055) !important;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-box:last-child {
margin-bottom: 0 !important;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-box .side-ttl {
margin: 0 0 15px !important;
padding: 0 0 12px !important;
border: 0 !important;
border-bottom: 1px solid var(--bam-a012-line, #d8e2dc) !important;
color: var(--bam-a012-deep, #073b22) !important;
font-size: 18px !important;
font-weight: 850;
line-height: 1.4;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-box .side-ttl .en {
display: block;
margin: 4px 0 0 !important;
color: var(--bam-a012-green, #0b6d45) !important;
font-size: 10px !important;
font-weight: 750;
line-height: 1.3;
letter-spacing: .12em;
text-transform: uppercase;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-t-box li {
margin-bottom: 10px;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-t-box li a {
padding: 9px;
border: 1px solid #e1ebe6;
border-radius: 12px;
background: #fff;
transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-t-box li a:hover,
html body.blog main.p-blog .blog-wrapper > .b-left .side-t-box li a:focus-visible {
border-color: #aed3c3;
background: #f7fbf9;
transform: translateY(-1px);
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-category li a {
padding: 8px 12px 8px 24px;
border-radius: 9px;
color: #244138;
font-size: 14px;
line-height: 1.55;
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-category li a:hover,
html body.blog main.p-blog .blog-wrapper > .b-left .side-category li a:focus-visible {
background: var(--bam-a012-mint, #eef7f2);
color: var(--bam-a012-deep, #073b22);
}
html body.blog main.p-blog .blog-wrapper > .b-left .side-box .t-archive select {
min-height: 46px;
border-color: var(--bam-a012-line, #d8e2dc);
border-radius: 10px;
background: #fff;
} html body.category main.p-blog .s-blog-list > li:hover .img-box img,
html body.category main.p-blog .s-blog-list > li:focus-within .img-box img {
width: 100% !important;
height: 100% !important;
transform: translate(-50%, -50%) scale(1.025) !important;
}
@media (max-width: 980px) {
html body.blog main.p-blog .blog-wrapper > .b-left {
position: static;
}
}