@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

/* RESET */
html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td, figure{
margin:0;
padding:0;
border:0;
font-weight:normal;
font-size:100%;
vertical-align:baseline;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
article, header, footer, aside, figure, figcaption, nav, section{
display:block;
}
body{
line-height:1;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
}
ul{
list-style:none;
list-style-type:none;
}
*:focus{
outline:none !important;
box-shadow:none !important;
}
@media (min-width: 768px) and (max-width: 991px) {
  .container {
    max-width: clamp(720px, 96vw, 991px);
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 992px;
  }
}

/* BASIC */
:root {
--color1: #47aab3;
--color2: #029294;
--color3: #bbdbd8;
--color4: #a0c067;
--color5: #d18e8b;
--color6: #f2ebdd;
--color7: rgb(71 170 179 /1);
--color8: #4788B3;
--color9: rgb(71 136 179 /1);
--border-radius: 10px;
--oswald: font-family: "Oswald", sans-serif;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
font-size:62.5%;
overflow-x:hidden;
}

body{
background:#fff;
font-size:clamp(1.4rem, 1.33rem + 0.19vw, 1.6rem);
line-height:1.75;
color:#333;
font-family:-apple-system, BlinkMacSystemFont, Roboto, Segoe UI semibold, Helvetica Neue, HelveticaNeue, YuGothic, Yu Gothic Medium, 游ゴシック Medium, 游ゴシック体, ヒラギノ角ゴ Pro W3, Verdana, Meiryo, メイリオ, sans-serif;
font-weight:400;
line-break:strict;
-webkit-text-size-adjust:100%;
text-size-adjust:100%;
}
h1 { font-size: clamp(2.4rem, 6vw, 3.2rem); }
h2 { font-size: clamp(2.2rem, 5vw, 2.8rem);letter-spacing: .05em; }
h3 { font-size: clamp(2.0rem, 6vw, 2.4rem); }
h4 { font-size: clamp(1.8rem, 5vw, 2rem); }
h5 { font-size: clamp(1.6rem, 6vw, 1.8rem); }
h6 { font-size: clamp(1.6rem, 5vw, 1.8rem); }
p  { font-size: clamp(1.5rem, 3vw, 1.6rem); }

strong{
font-size:1.6rem;
}

#allcontents{
margin:3rem auto 7rem;
}

#allcontents section{
display:block;
width:100%;
max-width:100%;
padding:0;
margin:0 auto 7rem;
}

#allcontents p{
padding:0 0 1.6rem;
margin:0;
}

img{
padding:0;
margin:0;
}
a img{
transition:.5s;
}
a img:hover{
opacity:.5;
}

.container > *:not(.row) {
padding-left: var(--bs-gutter-x);
padding-right: var(--bs-gutter-x);
}
@media (min-width:992px){
.navbar-expand-md .navbar-nav .nav-link {
padding-right: 10px;
padding-left: 10px;
}
}

.col-md-6{
margin-bottom:2rem;
}

/* COMMON*/
@media (min-width: 992px) {
.row-0			{margin-left:0px;	margin-right:0px;}
.row-0>div		{padding-right:0px;	padding-left:0px;}
.row-10			{margin-left:-5px;	margin-right:-5px;}	
.row-10>div		{padding-right:5px;	padding-left:5px;}
.row-20			{margin-left:-10px;	margin-right:-10px;}
.row-20>div		{padding-right:10px;padding-left:10px;}
.row-30			{margin-left:-15px;	margin-right:-15px;}
.row-30>div		{padding-right:15px;padding-left:15px;}
.row-40			{margin-left:-20px;	margin-right:-20px;}
.row-40>div		{padding-right:20px;padding-left:20px;}
.row-50			{margin-left:-25px;	margin-right:-25px;}
.row-50>div		{padding-right:25px;padding-left:25px;}
.row-60			{margin-left:-30px;	margin-right:-30px;}
.row-60>div		{padding-right:30px;padding-left:30px;}
}

/* Bootstrap spacing override (10px base) */
/* spacing: 10px base */
.mb-0  { margin-bottom: 0 !important; }       /* 0px */
.mb-1  { margin-bottom: 0.5rem !important; }  /* 5px */
.mb-2  { margin-bottom: 1rem !important; }    /* 10px */
.mb-3  { margin-bottom: 1.5rem !important; }  /* 15px */
.mb-4  { margin-bottom: 2rem !important; }    /* 20px */
.mb-5  { margin-bottom: 3rem !important; }    /* 30px */
.mb-6  { margin-bottom: 4rem !important; }    /* 40px */
.mb-7  { margin-bottom: 5rem !important; }    /* 50px */
.mb-8  { margin-bottom: 6rem !important; }    /* 60px */
.mb-9  { margin-bottom: 8rem !important; }    /* 80px */
.mb-10 { margin-bottom: 10rem !important; }   /* 100px */

/* LINK */
a{
color:var(--color2);
transition:.5s;
}
a:hover{
color:var(--color5);
}
a, a:hover{
text-decoration:none;
}
#wrapper-navbar .bg-primary{
background-color: transparent !important;
}

/* ユーティリティ */
.btnlinks{
display: block;
margin: 2rem 0 4rem;
}
.button{
position: relative;
display: inline-block;
padding: .375rem 3rem;
color: #fff;
background-color: var(--color1);
border-radius: 100px;
box-shadow: 0px 0px 0px 8px rgb(71 170 179 /.25);
}
.button:hover{
color: var(--color1);
background-color: #fff;
}
.button:before{
content: "";
position: absolute;
transition: .3s ease-in;
transition-delay: 0.1s;
right: 20px;
top: 49.5%;
display: block;
width: 0;
height: 1px;
background-color: var(--color1);
transform-origin: left;
}
.button:hover:before{
right: -15px;
width: 30px;
}


/* LAYOUT */
.center-center {
display: grid;
place-content: center;
gap: 1ch;
}


.navbar-brand,
.offcanvas-header {
background-color: var(--color1);
}

.navbar-brand {
display: block;
margin: 0;
padding: 10px;
background-color: var(--color1);
}

@media(min-width:992px){
.site{
padding-top: 120px;
}
.home .site{
padding-top: 0;
}
.home .hero{
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
}
.navbar>.container{
position: fixed;
z-index: 999;
top: 0;
left: 0;
right: 0;
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: auto auto;
max-width: 100%;
padding: 0;
}
.navbar-brand {
grid-row: 1 / span 2; /* ロゴは縦にまたがる */
align-self: center;
position: relative;
z-index: 2;
}
.nav-bar {
grid-column: 2;
grid-row: 1;
padding: 1rem;
display: grid;
grid-template-columns: minmax(0, 1fr) 200px;
align-items: center;
background-color: rgb(255 255 255 /.75);
backdrop-filter: blur(10px);
}
.serch-form input{
padding: .25rem;
border: none;
border-radius: 4px;
color: var(--color1);
}
.serch-form input[type="search"] {
background-image: url(images/search.svg) ;
background-repeat: no-repeat;
background-position: 10px center;
background-color: rgb(71 170 179 /.2);
background-size: 12px;
padding-left: 32px;
max-width: 100%;
transition: background .2s ease;
}

.serch-form input[type="search"]:focus,
.serch-form input[type="search"]:focus-visible {
padding-left: 5px;
background-image: none;
}

#main-nav{
padding: 0;
}
#contentareas{
padding: 30px;
}
#wrapper-footer{
}

.navbar-brand {
display: block;
margin: 0;
padding: 50px 15px;
background-color: var(--color1);
}
.navbar-brand img{
display: block;
margin: 0 auto;
}
.nav-link{
color: var(--color1);
}
.nav-link:focus, .nav-link:hover {
color: var(--color5);
}
}

.navbar img {
transition: height 0.3s ease;
}
.navbar-brand img.scrolled-logo{
display: none;
}
.is-scrolled.navbar .defult-logo{
display: none;
}
.is-scrolled.navbar .scrolled-logo{
display: block;
}


@media (max-width:1064px) {
.nav-bar {
grid-template-columns: minmax(0, 1fr) 100px;
}
.navbar img{
width: 100px;
}
}
.is-scrolled.navbar .navbar-brand img {
height: 36px;
}
.is-scrolled.navbar .navbar-brand {
padding: 11px 15px;
}


body{
background-color: #e8f2f3;
background-repeat: no-repeat;
background-position: right top;
}
body.page,
.post-type-archive,
.single-case,
.tax-download,
body.category-blog,
.single
{background-image: url(images/wave2.webp);}

.page-id-399,
.page-id-11,
.page-id-170,
.page-id-339,
.page-id-651,
.page-id-649,
.post-type-archive-network
{background-image: url(images/wave.webp) !important;}


.home .entry-header{
display: none;
}
#wrapper-footer{
background-color: var(--color1);
}


/* BREAD */
.breadcrumbs{
position: relative;
z-index: 9999;
display:flex;
flex-wrap: wrap;
align-items: center;
justify-content: end;
gap: 10px;
margin:2.5rem 0 0;
font-size:1.2rem;
color:#6c6c6c;
--bs-breadcrumb-margin-bottom:0;
}
.breadcrumbs .breadcrumb,
.breadcrumbs .breadcrumbs__separator {
display: block;
line-height: 1;
}
.breadcrumbs > a,
.breadcrumbs > span {
display: block;
white-space: nowrap;
}
.breadcrumbs a{
color:var(--color2);
margin-bottom:0;
transition: 0.1s;
}
.breadcrumbs a:hover{
opacity:.75;
}
.breadcrumb--last{
margin-bottom: 0;
}
.breadcrumbs__separator{
pointer-events: none;
margin-top: -1px;
}

/* FOOTER */
#wrapper-footer{
position: relative;
margin-top: 200px;
margin-bottom:0;
font-size:1.2rem;
}
.site-footer{
display: grid;
grid-template-columns: 1fr 1fr;
}
.footer-cta{
grid-column:1 / 3;
margin: -120px 0 6rem;
display: grid;
gap: 30px;
grid-template-columns: repeat(2 , 1fr);
}
.footer-cta a{
position: relative;
display: block;
padding: 4rem 0;
font-size: 2.4rem;
font-weight: 600;
text-align: center;
color: var(--color2);
background-color: #fff;
border: 10px solid var(--color1);
border-radius: var(--border-radius);
box-shadow: -10px 0px 24px rgba(149, 157, 165, 0.2) ;
}
.footer-cta a span{
display: block;
font-size: 1.6rem;
font-weight: 700;
color: var(--color1);
}
.footer-cta a:hover{
transform: translateY(-10px);
border-color: var(--color4);
}
.footer-cta a::before{
content: "";
position: absolute;
left: 30px;
display: block;
width: 100px;
height: calc(100% - 80px);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.footer-cta a:first-child::before{background-image: url(images/icon_dl.svg);}
.footer-cta a:last-child::before{background-image: url(images/icon_form.svg);}

.footer-cta_phone{
margin: 0 0 3rem;
grid-column:1 / 2;
grid-row: 2 / 3;
color: #fff;
}
.footer-cta_phone .phone{
margin: 0 0 .5rem;
font-family: "Oswald", sans-serif;
font-size: 3.6rem;
font-weight: 500;
}
.footer-cta_phone .time{
margin: 0 0 .5rem;
font-size: 1.6rem;
font-weight: 500;
color: rgb(255 255 255 /.75);
}
.footer-cta_phone .caution{
margin: 0;
font-size: 1.4rem;
font-weight: 500;
color: rgb(255 255 255 /.75);
}
.footer-cta_phone p.company-name span{
font-size: 18px;
font-weight: 600;
}
.external-site{
grid-column:1 / 2;
}
.footer_ourworks{
grid-column:2 / 3;
grid-row: 2 / 4;
display: grid;
gap: 30px;
grid-template-columns: 220px 1fr;
}
.footer-nav_child{
margin: 0;
padding: 0;
}
.footer-nav_child li{
margin: 0;
padding: 0;
}
.footer-nav_child li:not(:last-child) {
margin-bottom: .25rem;
border-bottom: 1px solid rgb(255 255 255 /.1);
}
.footer-nav_child li a{
display: block;
padding: .5rem 0;
font-size: 1.6rem;
font-weight: 600;
color: #fff;
}
.footer-utility_list{
margin: 0 0 3rem;
padding: 3rem 0;
grid-column:1 / 3;
display: flex;
justify-content: end;
}
.footer-utility_list li{
font-size: 1.4rem;
font-weight: 500;
}
.footer-utility_list li:not(:last-child) {
margin-right: 1em;
}
.footer-utility_list li a{
color: rgb(255 255 255 /.8);
}
.footer-utility_list li a:hover{
color: rgb(255 255 255 /1);
}
.site-info{
grid-column:1 / 3;
font-family: "Oswald", sans-serif;
font-size: 1rem;
font-weight: 500;
letter-spacing: .1em;
text-align: center;
}
#footer_canvas-container {
position: absolute;
top: -280px;
left: 0;
width: 100vw;
height: 300px;
z-index: -1;
}
#footer_canvas-container canvas {
display: block;
width: 100%;
height: 100%;
}



.page .entry-header{
margin: 0 0 4rem;
}
.page .entry-header h1.entry-title{
margin: 0 auto;
font-size: clamp(1.6rem, 4vw, 3.2rem);
font-weight: 600;
text-align: center;
}

/* PAGINATION */
.pagination{
margin: 0 0 90px;
justify-content: center;
gap: 0 10px;
}
.pagination li .page-link{
font-family: var(--oswald);
font-size: 16px;
}
.page-item .page-link{
border: 1px solid var(--color1);
border-radius: 100px !important;
width: 38px;
text-align: center;
}
.active>.page-link, .page-link.active{
background-color: var(--color1);
}
.page-link{
color: var(--color1);
}
.page-link:hover{
}

/* CANVAS*/
canvas {
display: block;
width: 100vw;
position: relative;
z-index: 0;
left: 50%;
right: 50%;
top: 0;
margin-left: -50vw;
margin-right: -50vw;
}

/*FRONT PAGE*/
.info-navigator h2,
.case-studies h2,
.our-services h2,
.news-topics h2,
.blog-section h2{
margin: 0 0 30px;
padding: 0;
font-size: 3rem;
font-weight: 700;
text-align: center;
}
.info-navigator h2 span,
.case-studies h2 span,
.our-services h2 span,
.news-topics h2 span,
.blog-section h2 span{
display: block;
margin: 0 0 10px;
padding: 0;
font-size: 1.5rem;
font-weight: 700;
color: var(--color1);
}

.home .wpmem_form-register{
margin: 0 0 30px;
padding: 15px;
display: grid;
grid-template-columns:300px 1fr;
}
.home .wpmem_form-register p{
grid-column:1 / 2;
}
.home .wpmem_form-register ul{
grid-column:2 / 3;
display: flex;
justify-content: end;
}
.home .wpmem_form-register ul li:nth-child(1){
margin-right: 15px;
}
.home .wpmem_form-register ul li a{
display: block;
padding: .5rem 2rem;
color: #fff;
background-color: var(--color1);
border-radius: 100px;
}

.home .hero .mv{
display: grid;
grid-template-columns: 60vw 450px;
margin: 0 0 4rem;
}
.home .hero .mv > video{
border-radius: 0 0 40px 0;
width: 960px;
max-width: 100%;
}
.home .hero .mv div{
position: relative;
z-index: 2;
transform: translate(-60px , 0);
align-self:center;
}
.home .hero .mv div p:nth-child(1){
margin: 0 0 1rem;
padding: 0;
font-size: 4rem;
font-weight: 700;
}
.txt_tsumugu{
display: flex;
justify-content: center;
margin: 0;
padding: 0;
}
.txt_tsumugu li{
position: relative;
}
.txt_tsumugu1 {
margin: 0 0 25px;
}
.txt_tsumugu1 li:nth-child(1){animation: tsumugu1 0.9s ease-out 0.1s both;}
.txt_tsumugu1 li:nth-child(2){animation: tsumugu1 0.9s ease-out 0.2s both;}
.txt_tsumugu1 li:nth-child(3){animation: tsumugu1 0.9s ease-out 0.3s both;}
.txt_tsumugu1 li:nth-child(4){animation: tsumugu1 0.9s ease-out 0.4s both;}
.txt_tsumugu1 li:nth-child(5){animation: tsumugu1 0.9s ease-out 0.5s both;}
.txt_tsumugu1 li:nth-child(6){animation: tsumugu2 0.9s ease-in 1.7s both;}
.txt_tsumugu1 li:nth-child(7){animation: tsumugu1 0.9s ease-out 0.6s both;}
.txt_tsumugu1 li:nth-child(8){animation: tsumugu2 0.9s ease-in 2.0s both;}
.txt_tsumugu1 li:nth-child(9){animation: tsumugu1 0.9s ease-out 0.7s both;}
.txt_tsumugu2 li:nth-child(1){animation: tsumugu1 0.6s ease-out 0.8s both;}
.txt_tsumugu2 li:nth-child(2){animation: tsumugu1 0.6s ease-out 0.9s both;}
.txt_tsumugu2 li:nth-child(3){animation: tsumugu1 0.6s ease-out 1.0s both;}
.txt_tsumugu2 li:nth-child(4){animation: tsumugu1 0.6s ease-out 1.1s both;}
.txt_tsumugu2 li:nth-child(5){animation: tsumugu1 0.6s ease-out 1.2s both;}
.txt_tsumugu2 li:nth-child(6){animation: tsumugu2 0.9s ease-in 2.5s both;}
.txt_tsumugu2 li:nth-child(7){animation: tsumugu1 0.6s ease-out 1.3s both;}
.txt_tsumugu2 li:nth-child(8){animation: tsumugu2 0.9s ease-in 2.8s both;}
.txt_tsumugu2 li:nth-child(9){animation: tsumugu1 0.6s ease-out 1.4s both;}
@keyframes tsumugu1{
0%{ right: -60px; opacity: 0; }
100%{ right: 0; opacity: 1; }
}
@keyframes tsumugu2{
0%{ transform: scaleX(0%); opacity: 0; }
100%{ transform: scaleX(100%); opacity: 1; }
}

.home .introduction{
margin: 0;
font-size: 1.8rem;
font-weight: 600;
letter-spacing: .1em;
line-height: 2;
color: #14717e;
}

.info-navigator{
margin: 0 0 90px;
padding: 15px;
text-align: center;
background-color: rgb(71 170 179 /.35);
border-radius: var(--border-radius);
}
.info-navigator h2{
margin-top: -60px;
}
.info-navigator input{
padding: 1rem 4rem;
font-size: 1.8rem;
color: var(--color1);
border: 3px solid var(--color1);
border-radius: 100px;
}

.case-studies{
position: relative;
z-index: 2;
margin: 0 0 90px;
padding: 15px;
}
.ul_case-studies{
display: grid;
grid-template-columns:repeat(6, 1fr);
gap: 15px;
}
.ul_case-studies img{
display: block;
margin: 0 auto;
padding: 15px;
background-color: #fff;
border-radius: 50%;
box-shadow: rgb(71 170 179 /.2) 0px 8px 24px;
border: 3px solid var(--color1);
}
.ul_case-studies img:hover{
opacity: 1;
transform: translateY(-2px);
border: 0px solid var(--color1);
}
.our-services{
margin: 0 0 90px;
padding: 30px;
border: 5px solid var(--color3);
border-radius: var(--border-radius);
}
.our-services h2{
margin: -50px auto 30px;
padding: 0 30px;
text-align: center;
width: fit-content;
background-color: rgb(232, 242, 243);
}
.our-services-contents{
display: grid;
grid-template-columns:repeat(3, 1fr);
gap: 15px;
}
.our-services-contents article{
padding: 15px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}
.our-services-contents article img{
aspect-ratio: 16 / 9;
object-fit: cover;
overflow: hidden;
margin-bottom: 15px;
border-radius: var(--border-radius);
}

.our-services-contents article:nth-child(1){grid-column:1 / 2;}
.our-services-contents article:nth-child(2){grid-column:2 / 3;}
.our-services-contents article:nth-child(3){grid-column:3 / 4;}
.our-services-contents article:nth-child(4){grid-column:1 / 4;background-color: transparent;padding:0 10% 0 20%;margin-top: 30px;}
.our-services-contents article:nth-child(5){grid-column:1 / 4;background-color: transparent;padding:0 20% 0 10%;margin-bottom: 30px;}
.our-services-contents article:nth-child(6){grid-column:1 / 4;background-color: transparent;padding:0 0% 0 30%;margin-bottom: 30px;}

.our-services-contents article:nth-child(1),
.our-services-contents article:nth-child(2),
.our-services-contents article:nth-child(3){
display: flex;
flex-direction: column;
}
.our-services-contents article:nth-child(1) .button,
.our-services-contents article:nth-child(2) .button,
.our-services-contents article:nth-child(3) .button{
margin-top: auto;
}

.our-services-contents article:nth-child(4),
.our-services-contents article:nth-child(5),
.our-services-contents article:nth-child(6){
display: grid;
grid-template-columns:repeat(2, 1fr);
gap: 30px;
}
.our-services-contents article:nth-child(4),
.our-services-contents article:nth-child(5){
margin-bottom: 60px;
}

.our-services-contents article h3{
margin: 0 0 1rem;
padding: 0;
font-size: 2.4rem;
font-weight: 700;
}
.our-services-contents article p:nth-of-type(1){
margin: 0 0 5px;
padding: 0;
font-size: 1.8rem;
font-weight: 600;
color: var(--color2);
}
.our-services-contents article p:nth-of-type(2){
margin: 0 0 30px;
padding: 0;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.5;
}
.news-topics{
margin: 0 0 90px;
}
.news-topics .inner{
position: relative;
padding: 30px;
background-color: rgb(255 255 255 /1);
border-radius: var(--border-radius);
}
.news-topics .inner::before{
content: "";
position: absolute;
z-index: -1;
bottom: -90px;
left: 50%;
right: 50%;
margin-left: 0;
margin-right: -50vw;
display: block;
width: 50vw;
height: 50%;
background-color: #e8f2f3;
}

.news-topics .inner::after{
content: "";
position: absolute;
z-index: -2;
top: 90px;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
display: block;
width: 100vw;
height: 100%;
background-color: rgb(71 170 179 /.1);
}
.home .news-topics div div h3{
color: var(--color8);
}
.topics-item{
margin: 0;
padding: 15px 0;
border-bottom: 1px solid var(--color3);
}
.home .news-topics div div:first-child{
display: block;
margin: 0 0 15px;
}
.home .news-topics div div:first-child .topics-date{
display: block;
margin: 0 0 15px;
}
.home .news-topics div div:first-child h3{
position: relative;
margin: 0 0 30px;
color: var(--color8);
}
.home .news-topics div div:first-child h3::after{
content: "";
position: absolute;
left: -30px;
bottom: -10px;
display: block;
width: 50%;
height: 1px;
background-color: var(--color8);
}

.home .blog-section{
margin: 0 0 30px;
padding: 15px;
display: grid;
grid-template-columns:300px 1fr;
border-radius: var(--border-radius);
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.cta{
margin: 0 0 30px;
padding: 15px;
display: grid;
grid-template-columns:300px 1fr;
border-radius: var(--border-radius);
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}



/* MOVIE */
.formovie{
max-width:80%;
margin:0 auto;
}
.moviebox{
margin:1.4rem auto 0;
}

.moviesec{
margin: 0 0 90px;
padding:30px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}

.moviesec h3{
font-size:2.2rem;
text-align:center;
margin-bottom:2rem;
font-weight:600;
letter-spacing:0.05em;
}

.moviesec h3 span{
display:block;
font-size:0.8rem;
color:#1a76d2;
margin-bottom:0.5rem;
letter-spacing:0.1em;
}

.formovie .col-md-6{
display:flex;
flex-direction:column;
align-items:center;
}

.moviebox{
position:relative;
width:100%;
aspect-ratio:16 / 9;
overflow:hidden;
border-radius:12px;
box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);
transition:transform 0.3s ease, box-shadow 0.3s ease;
}

.moviebox:hover{
transform:translateY(-4px);
box-shadow:0 8px 20px rgba(0, 0, 0, 0.12);
}
.moviebox {
margin: 0 0 15px;
}
.moviebox iframe{
width:100%;
height:100%;
border:0;
display:block;
}

.formovie h2{
font-family:'Noto Sans JP', sans-serif;
font-size:clamp(1.7rem, 3vw, 2rem);
font-weight:500;
letter-spacing:0.04em;
color:rgba(51,51,51,.8);
text-align:center;
text-transform:none;
position:relative;
}
.formovie h2::before{
content:"";
position:absolute;
left:-1rem;
top:.6rem;
width:4px;
height:0.8em;
background:rgba(51,51,51,.5);
}
.formovie h2::after{
content:"";
position:absolute;
right:-1rem;
top:.6rem;
width:4px;
height:0.8em;
background:rgba(51,51,51,.5);
}
.formovie p{
font-size:clamp(1.4rem, 1.8vw, 1.6rem);
line-height:1.8;
color:#444;
margin-top:1rem;
max-width:90%;
text-align:left;
}

/* スマホ対応 */
@media (max-width:767px){
.moviesec{
padding:50px 0;
}

.formovie .col-md-6{
margin-bottom:2.5rem;
}

}


/* 会員コンテンツ　*/
body.page-id-227 #wpmem_login, .register-area #wpmem_login{
display:none !important;
}
.req-text{
display:none !important;
}
.req-mark{
display:inline-block;
background:#a11900;
font-size:.9rem;
text-align:center;
color:#fff;
line-height:1;
padding:.3rem .5rem;
margin-left:.5rem;
border-radius:2px;
}
/* 登録完了メッセージ */
.wpmem_msg{
width:100%;
max-width:100%;
background:transparent;
border:none;
}
.regsuccess{
margin-top:1.5em;
padding:1em 1.5em;
background:#f5faff;
border:1px solid #d4e6f7;
border-radius:6px;
line-height:1.8;
font-size:1rem;
color:#333;
text-align:left;
}
/* ログインフォーム内の間隔 */
#wpmem_login p,
#wpmem_login .wpmem_field{
margin-bottom:1em;
}
/* 入力欄 */
#wpmem_login input[type="text"],
#wpmem_login input[type="password"]{
width:100%;
max-width:400px;
border:1px solid #ccc;
border-radius:4px;
padding:0.5em;
}
/* パスワード変更 */
#wpmem_login legend{
display:none;
}

/* FluentForms 既存の * を非表示にする */
.ff-el-is-required.asterisk-right label::after{
content:"" !important;
}
/* 必須バッジ */
.ff-el-input--label.ff-el-is-required label::after{
content:"必須" !important;
display:inline-block !important;
background:#d9534f !important;
color:#fff !important;
font-size:0.7rem !important;
padding:2px 6px !important;
border-radius:3px !important;
margin-left:6px !important;
line-height:1 !important;
}
/* 任意バッジ */
.ff-el-input--label:not(.ff-el-is-required) label::after{
content:"任意";
display:inline-block;
background:#999; 
color:#fff;
font-size:0.7rem;
padding:2px 6px;
margin-left:6px;
}

/* 新規会員登録 */
#wpmem_reg legend{
display:none;
}

/* 資料室 */
.mateimg{
width:100%;
aspect-ratio:4 / 3;
overflow:hidden;
}
.mateimg img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* プライバシーポリシー */
.ppnumbers, .pplists{
margin-left:3rem;
}
.pplists li{
list-style-type:disc;
}


/* 開発事例 */
#material_fiber,
#material_outer,
#material_inner,
#material_sustainable,
#material_wellness,
#material_femcare{
position: relative;
}
#material_fiber{scroll-margin-top: 90px;}
#material_outer{scroll-margin-top: 90px;}
#material_inner{scroll-margin-top: 90px;}
#material_sustainable{scroll-margin-top: 90px;}
#material_wellness{scroll-margin-top: 90px;}
#material_femcare{scroll-margin-top: 90px;}

.material_fiber,
.material_outer,
.material_inner,
.material_sustainable,
.material_wellness,
.material_femcare{
margin-bottom: 90px;
}

.casesec{
margin-bottom: 6rem;
padding: 1rem 0;
}
.casesec .interlude{
margin: 0 0 4rem;
}
.casesec h1{
position: relative;
margin: 0 auto 15px;
padding: 1rem;
font-size: 3.6rem;
font-weight: 600;
line-height: 1;
text-align: center;
}
.casesec h1 span{
position: relative;
top: -5px;
display: inline-block;
margin: 0 0 0 1rem;
padding: 1rem;
font-size: 1.8rem;
font-weight: 500;
text-align: center;
color: var(--color2);
border-left: 1px solid #000;
}
.casesec h2{
margin: 0 auto 15px;
text-align: center;
}
.casesec h3{
margin: 0 auto 30px;
padding: 10px 0;
text-align: center;
border-top: 1px solid var(--color1);
border-bottom: 1px solid var(--color1);
width: fit-content;
}
.casesec p{
font-weight: 600;
line-height: 1.75;
text-align: center;
}
.casesec table{
margin: 0 0 1rem;
padding: 0;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
}
.casesec th,
.casesec td{
padding: .5rem;
border-bottom: 1px solid rgb(0 0 0 /.1);
}
.casesec th{
border-bottom: 3px solid rgb(0 0 0 /.1);
}
.ggmap{
padding: 2rem 0 0;
}
.ggmap iframe{
width: 100% !important;
height: 350px;
border-radius: var(--border-radius);
}
.casesec img{
display: block;
transform: scale(.8);
transform-origin: center;
border-radius: var(--border-radius);
}


.lineups h2{
margin: 0 auto 30px;
text-align: center;
}
.lineups h2 span{
display: block;
font-family: var(--oswald);
font-size: 1.6rem;
color: var(--color1);
}

.casedetails{
margin: 0 0 60px;
padding: 30px;
border-width: 0 1px 1px 0;
border-style: solid;
border-color: var(--color3);
border-radius: 0 0 10px 10px;
}
.lineup.row{
margin: 0 0 60px;
padding: 30px;
border-width: 0 1px 1px 0;
border-style: solid;
border-color: var(--color3);
border-radius: 0 0 10px 10px;
}
.lineups h3,
.casedetails h3{
position: relative;
margin: 0 0 15px;
padding: 10px;
text-align: center;
border-top: 1px solid var(--color1);
border-bottom: 1px solid var(--color1);
width: fit-content;
}
.lineups h3::before,
.casedetails h3::before{
content: "";
position: absolute;
left: 0;
top: 0;
display: block;
width: 30px;
height: 3px;
background-color: rgb(71 170 179 /.25);
}
.lineups h3::after,
.casedetails h3::after{
content: "";
position: absolute;
z-index: -1;
left: 4px;
top: 4px;
display: block;
width: 100%;
height: 100%;
background-color: rgb(71 170 179 /.1);
}

.casedetails p{
position: relative;
margin: 0 0 30px;
}
.lineups img,
.casedetails img{
border-radius: var(--border-radius);
}

.totalinfo{
}
.totalinfo .col-md-12{
margin: 0 0 90px;
}
.totalinfo .col-md-12 .inner{
padding: 1px;
background-color: #fff;
border: 2px solid var(--color1);
}
.totalinfo .col-md-12 h2{
font-size: 2.1rem;
font-weight: 600;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
background-color: var(--color1);
}
.totalinfo .col-md-12 h3{
padding: 10px 0;
font-weight: 600;
}

.totalinfo .col-md-12 ul{
margin: 0 0 30px;
}
.totalinfo p.mt-3{
margin-bottom:15px;
}
.totalinfo .col-md-12 ul li{
font-family: var(--oswald);
font-size: 2.2rem;
font-weight: 600;
}
.totalinfo .col-md-12 ul li:nth-child(2),
.totalinfo .col-md-12 ul li:nth-child(3){
font-size: 1.6rem;
font-weight: 500;
}
.totalinfo .col-md-12 ul li p{
margin-bottom:15px;
}

.subphotosec{
margin-bottom: 6rem;
padding: 4rem;
background-color: rgb(255 255 255 /.75);
border-radius: var(--border-radius);
}
.subfreesec{}
.subfreesec h2{
display: block;
margin: 0 0 2rem;
padding-top: 6rem;
font-size: 3.2rem;
font-weight: 600;
}
.subfreesec p{
display: block;
margin: 0 0 2rem;
font-size: 1.8rem;
letter-spacing: .1em;
font-weight: 600;
line-height: 1.75;
}
.subfreesec img{
display: block;
margin: 0 auto;
border-radius: var(--border-radius);
box-shadow: 10px 10px 0px rgb(255 255 255 /1);
}


/* H1グループ */
.hgroup{
margin: 0 0 4rem;
}
.hgroup h1{
text-align: center;
}
.hgroup span{
display: block;
font-family: var(--oswald);
font-size: 1.6rem;
color: var(--color1);
}
.introduction p{
text-align: justify;
}

/* 私たちのお仕事 */
.page-id-399 {}
.page-id-399 .introduction p:last-child{
margin-bottom: 8rem;
}

.productions{}
.productions .col-md-6{
position: relative;
margin-bottom: 6rem;
}
.page-id-399 .productions h2{
position: absolute;
left: 30px;
top: -15px;
z-index: 1;
width: fit-content;
margin: 0;
padding: 1.5rem 3rem;
background-color: rgb(255 255 255 /.95);
border-radius: 0 0 10px 0;
}
.page-id-399 .productions h2 span{
display: block;
margin: .25rem 0 0;
padding: 0;
font-size: 1.6rem;
font-weight: 600;
color: var(--color1);
}
.productions img{
margin: 0 0 2rem;
border-radius: var(--border-radius);
}
.page-id-399 .productions p{
margin-bottom: 3rem;
text-align: justify;
}


/* 素材の調達・開発Fiber */
.page-id-401 {}
.dev-outline{
margin: 0 0 6rem;
}
.dev-outline h1{
margin: 0;
padding: 0;
font-size: 2.4rem;
letter-spacing: .1em;
line-height: 1.5;
}
.dev-outline p{
margin: 0;
padding: 0;
font-size: 2.2rem;
font-weight: 600;
letter-spacing: .1em;
line-height: 1.75;
color: var(--color1);
}
.cap {
margin-bottom: 120px;
}
.cap .inner{
position: relative;
padding: 30px;
border: 1px solid var(--color1);
border-radius: var(--border-radius);
}
.cap .inner::after{
content: "";
position: absolute;
z-index: -1;
left: 15px;
bottom: 15px;
display: block;
width: calc(100% - 30px);
height: calc(100% - 60px);
background-color: rgb(71 170 179 /.125);
border-radius: var(--border-radius);
}

.cap .inner h2{
margin-top: -60px;
padding: 10px;
background-color: #e8f2f3;
width: fit-content;
}
.cap-list{
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
.cap-list li{
position: relative;
padding: 0 0 0 80px;
font-size: 2rem;
font-weight: 600;
line-height: 1.6;
height: 60px;
display: flex;
align-items: center;
}
@media(max-width:834px){
.cap-list li{
font-size: 1.5rem;
}
}

@media(max-width:720px){
.cap-list{
grid-template-columns: 1fr;
gap: 30px;
}
.cap-list li{
font-size: 1.4rem;
}
}
.cap-list li::before{
content: "";
position: absolute;
left: 0;
top: 0;
display: block;
width: 60px;
height: 60px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.cap-list li:nth-child(1)::before{background-image: url(images/design_01.svg);}
.cap-list li:nth-child(2)::before{background-image: url(images/design_02.svg);}
.cap-list li:nth-child(3)::before{background-image: url(images/design_03.svg);}
.cap-list li:nth-child(4)::before{background-image: url(images/design_04.svg);}
.cap-list li:nth-child(5)::before{background-image: url(images/design_05.svg);}
.cap-list li:nth-child(6)::before{background-image: url(images/design_06.svg);}

.workinfosec h2,
.hworkinfosec h2,
.sworkinfosec h2{
margin: 0 auto 60px;
text-align: center;
}
.workinfosec h2 span,
.hworkinfosec h2 span,
.sworkinfosec h2 span{
display: block;
margin-top: 10px;
font-family: var(--oswald);
font-size: 1.5rem;
font-weight: 500;
letter-spacing: .1em;
color: var(--color1);
}
.competency{
}
.competency article{
display: grid;
grid-template-columns: 480px auto;
gap: 60px;
margin: 0 0 8rem;
}
.competency article img{
aspect-ratio: 16/9;
object-fit: cover;
display: block;
margin: 0 auto;
border-radius: var(--border-radius);
}
.competency article h3{
position: relative;
margin: 0 0 2rem;
font-size: 2.2rem;
font-weight: 700;
line-height: 1.5;
letter-spacing: .1em;
}
.competency article h3::first-letter{
color: var(--color1);
font-size: 3.6rem;
float: left ;
line-height: .75;
margin-right: .1em;
}

@media (max-width: 600px) {
.competency article h3::first-letter::first-letter {
float: none;
line-height: 1;
margin-right: 0;
}
}
.competency article p{
text-align: justify;
}
.section_dev{
position: relative;
margin: 0 0 120px;
padding: 60px 0;
}
.section_dev::after{
content: "";
position: absolute;
z-index: -1;
left: 0;
top: 0;
display: block;
width: 100vw;
height: 100%;
background-color: rgb(71 170 179 /.125);
}
.dev-ex{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px 60px;
margin: 0;
}
.dev-ex article{
position: relative;
}
.dev-ex img{
aspect-ratio: 24 /10;
object-fit: cover;
display: block;
margin: 0 auto 2rem;
border-radius: var(--border-radius);
}
.dev-ex p{
margin: 0;
padding: 0;
font-size: 1.8rem;
font-weight: 500;
letter-spacing: .05em;
}
.dev-ex .product-title{
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
bottom: 0;
padding: 5px 20px;
color: var(--color1);
background-color: #e8f2f3;
width: fit-content;
border-radius: 5px 5px 0 0;
}

@media(max-width:834px){
.competency article {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
margin: 0 0 6rem;
}
.dev-ex {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
margin: 0;
}
.dev-ex img {
margin: 0 auto;
border-radius: 5px 5px 0 0;
}
.dev-ex .product-title {
position: relative;
left: inherit;
right: inherit;
margin: 0;
bottom: inherit;
padding: 5px;
background-color: #e8f2f3;
width: auto;
border-radius: 0 0 5px 5px;
}
}

.process{
margin: 0 0 8rem;
}
.process ol{}
.process ol{
margin: 0 0 2rem;
padding: 0;
list-style: none;
counter-reset: number;
}
.process ol li {
margin: 0 0 1rem 1.25rem;
line-height: 2.5;
padding: 1rem 1rem 1rem 1rem;
border: 1px solid var(--color1);
border-radius: 4px;
list-style: none;
position: relative;
}
.process ol li:before {
float: left;
width: 3rem;
height: 3rem;
border-radius: 50%;
color: #fff;
background: var(--color4);
text-align: center;
line-height: 1.9;
counter-increment: number;
content: counter(number);
margin-right: .5rem;
margin-left: -2.5rem;
}

.network{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 60px;
margin: 0 0 6rem;
}
.network img{
aspect-ratio: 16 / 9;
object-fit: cover;
display: block;
margin: 0 auto 2rem;
border-radius: var(--border-radius);
}

/* 環境に配慮した製品開発Sustainable */
.page-id-407{}
.page-id-407 h1{
font-size: clamp(2.4rem, 6vw, 3.2rem);
text-align: center;
}
.page-id-407 h1 span{
display: block;
font-family: var(--oswald);
font-size: 1.8rem;
font-weight: 500;
}
.page-id-407 .dev-outline p{
margin: 0 0 30px;
padding: 0;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .1em;
line-height: 1.75;
color: inherit;
}
.page-id-407 p.cathcys{
margin: 0;
padding: 0;
font-size: 2.2rem;
font-weight: 600;
letter-spacing: .1em;
line-height: 1.75;
color: var(--color1);
}
.sworkinfosec{
margin: 0 0 90px;
}
.sworkinfosec figure{
height: 100%;
padding: 30px;
background-color: rgb(255 255 255/.5);
border-radius: var(--border-radius);
}
.sworkinfosec img{
display: block;
margin: 0 auto 30px;
aspect-ratio: 16/9;
border-radius: var(--border-radius);
overflow: hidden;
}
.sworkinfosec figcaption h3{
margin: 0 0 25px;
}

/* 医療・健康・美容分野への挑戦医療・ヘルスケア */


/* 取得認証一覧 */
.page-id-651{}
.cersec{
position: relative;
padding: 60px 0
}
.cersec article{
position: relative;
margin: 0 0 30px;
height: 100%;
display: flex;
flex-direction: column;
}
.cersec article img{
margin: 0 0 30px;
border-radius: var(--border-radius);
}
.cersec article h2{
position: relative;
margin: 0 0 30px;
font-size: 2rem;
}
.cersec article p{
position: relative;
margin: 0 0 30px;
text-align: justify;
}
.cersec .col-md-4 .links {
margin-top: auto;
}
/* 関連会社 */
.networklist{
display: grid;
grid-template-columns: repeat(3 , 1fr);
gap: 60px;
margin: 0 0 90px;
}
@media(max-width:834px){
.networklist{
gap: 30px;
}
}
@media(max-width:600px){
.networklist{
grid-template-columns: repeat(2 , 1fr);
gap: 15px;
}
}

.networklist div{
display: flex;
flex-direction: column;
}
.networklist div h2{
margin: 0 0 15px;
padding: 0;
font-size: 2rem;
}
.networklist div img{
aspect-ratio: 16 / 9;
overflow: hidden;
display: block;
margin: 0 0 15px;
border-radius: var(--border-radius);
}
.networklist .button{
margin-top: auto;
width: fit-content;
}

/* オンラインショップリスト */
.page-id-649{}
.shopsec{
position: relative;
padding: 60px 0
}
.shopsec .inner{
position: relative;
padding: 30px;
background-color: rgb(255 255 255 /.1);
}
.shopsec .inner::before{
content: "";
position: absolute;
z-index: -1;
left: 0;
top: 0;
display: block;
width: 100%;
height: 100%;
border: 3px solid #fff;
}
.shopsec .inner::after{
content: "";
position: absolute;
z-index: -1;
left: 25%;
top: 10px;
display: block;
width: 75.5%;
height: 100%;
background-color: rgb(255 255 255 /.5);
}

.shopsec .row-60{
margin-bottom: 60xp;
}
.shopsec h2{
margin: 0 0 30px;
}
.shopsec h2 span{
display: block;
margin-top: 10px;
font-family: var(--oswald);
font-size: 1.5rem;
font-weight: 500;
letter-spacing: .1em;
color: var(--color1);
}
.shopsec p{
margin: 0 0 30px;
text-align: justify;
}
.shopsec .links {
margin-bottom: 60px;
}

.can-do {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
}
@media (min-width: 768px) {
.can-do {
grid-template-columns: repeat(5, 1fr);
}
}
.can-do img{
padding: 10px;
border: 1px solid #fff;
}


/* 会社情報 */

.page-id-11 {}
.page-id-11 .companysec {
margin: 0 0 8rem;
}
.page-id-11 .companysec .pdflinks {
margin: 0 auto 60px;
}

.page-id-11 .companysec h1{
margin: 0 0 3rem;
padding: 0;
font-weight: 600;
text-align: center;
}
.page-id-11 .companysec h1 span{
display: block;
margin: 0;
padding: 0;
font-size: 1.6rem;
color: var(--color1);
}
.companysec h2{
position: relative;
margin: 0 auto 30px;
text-align: center;
}
.companysec h2::after{
content: "";
position: absolute;
bottom: -10px;
left: 0;
right: 0;
margin: 0 auto;
display: block;
width: 30px;
height: 3px;
background-color: var(--color1);
}
.companysec h3{
margin: 0 auto 30px;
padding: 5px 10px;
text-align: center;
background-color: rgb(255 255 255 /.5);
width: fit-content;
border: 1px solid  rgb(71 170 179 /.25);
}
.companysec table{
margin: 0 0 60px;
width: 100%;
}
.companysec th,
.companysec td{
padding: 10px 20px;
width: 50%;
border-bottom: 1px solid var(--color3);
}
.companysec th{
text-align: right;
}

/* ご相談・お問い合わせ */
.page-id-170 {}
.ff-el-form-check {
text-align: center;
}
.fluentform {
margin: 0 0 90px;
padding: 60px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}

form.fluent_form_3 .ff-btn-submit:not(.ff_btn_no_style){
font-size: 1.8rem;
background-color: var(--color5) !important;
box-shadow: 0 0 0 10px var(--color6);
transition: .3s;
}

/* プライバシーポリシー */

.page-id-339 {}
.page-id-339 .policysec {
margin: 0 0 8rem;
}
.page-id-339 .policysec h2{
margin: 0 0 2.5rem;
padding: 1rem 1rem 1rem 0;
font-size: 2rem;
font-weight: 600;
border-style: solid;
border-width: 1px 1px 1px 0px;
border-color: var(--color1);
}
.page-id-339 .policysec h3{
position: relative;
margin: 0 0 2rem;
padding: 1rem;
font-size: 1.8rem;
font-weight: 600;
border-style: solid;
border-width: 0px 0px 1px 3px;
border-color: var(--color1);
}
.page-id-339 .policysec p{
margin: 0 0 3rem;
padding: 1rem;
}
.page-id-339 .policysec ul.pplists{
margin: 0 0 3rem;
padding: 0 1rem 0 3.5rem;
}
.page-id-339 .policysec ol.ppnumbers{
margin: 0 0 3rem;
padding: 0 1rem 0 3.5rem;
}
.page-id-339 .policysec ol.ppnumbers li{
margin: 0;
padding: 0;
}
.page-id-339 .policysec ol.ppnumbers li h4{
margin: 0 0 .25rem;
padding: 0;
font-size: 1.8rem;
font-weight: 600;
}
.page-id-339 .policysec ol.ppnumbers li p{
margin: 0 0 1rem;
padding: 0;
}

/* ARCHIVE*/
.category-blog {}
.page-header
.page-title{}
.page-title span{}

/* 開発事例 */
.post-type-archive-case {}
.ref-room h1{
margin: 0 auto 60px;
text-align: center;
}
.ref-room h1 span{
display: block;
font-family: var(--oswald);
font-size: 1.6rem;
font-weight: 500;
color: var(--color1);
}
.tax-download  h1{
margin: 0;
text-align: inherit;
}
.post-type-archive-case .case-studies {
margin: 0 0 90px;
}
.post-type-archive-case h2{
margin: 0 auto 30px;
text-align: center;
}
.post-type-archive-case .ref-room .container > .inner{
margin: 0;
padding: 30px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}
.post-type-archive-case .ref-room .container > .inner h2{
margin-top:-45px;
}
.post-type-archive-case .ref-room .container > .inner h2 span{
display: block;
font-family: var(--oswald);
font-size: 1.6rem;
font-weight: 500;
color: var(--color1);
}

.ref-room .col-md-4 .inner {
position: relative;
padding: 0 0 30px;
display: flex;
flex-direction: column;
height: 100%;
background-color: #fff;
border-radius: 10px;
box-shadow: rgb(71 170 179 /.2) 0px 8px 24px;
overflow: hidden;
}
.ref-room .col-md-4 .inner h2,
.ref-room .col-md-4 .inner h3{
margin: 0 0 10px;
padding: 0 15px;
font-size: clamp(1.6rem, 6vw, 2rem);
color: var(--color2);
}
.ref-room .col-md-4 .inner ul{
margin: 0 0 10px;
padding: 0;
display: flex;
}
.ref-room .col-md-4 .inner ul li{
position: relative;
display: inline-block;
padding: 3px 18px 3px 9px;
background-color: var(--color6);
border-radius: 5px 0 0 5px;
transform: translate(-35px ,-10px);
}
.ref-room .col-md-4 .inner ul li::after {
content: "";
position: absolute;
top: 0;
right: -5%;
width: 20%;
height: 100%;
background: inherit;
transform: skewX(-20deg);
}


.ref-room .col-md-4 .inner img{
aspect-ratio: 16 / 9;
overflow: hidden;
display: block;
margin: 0 0 15px;
}
.ref-room .col-md-4 .inner p{
margin-bottom: 30px;
padding: 0 15px;
font-size: clamp(1.4rem, 3vw, 1.4rem);
color: #3c3c3c;
}
.ref-room .col-md-4 .inner p:last-child {
margin-top: auto;
margin-bottom: 0;
}

/* Creosの知識箱 */
.category-blog .page-header{
margin: 0 0 60px;
}
.category-blog .page-header .page-title{
text-align: center;
}

.grid-creos{
display: grid;
grid-template-columns: repeat(3 , 1fr);
gap: 60px;
}
.grid-creos article{
display: flex;
flex-direction: column;
}
.grid-creos article img{
aspect-ratio: 16 /9;
object-fit: cover;
display: block;
margin: 0 auto 15px;
border-radius: var(--border-radius);
}
.grid-creos article h2{
margin: 0 0 15px;
padding: 0;
font-size: 1.8rem;
}
.grid-creos article h2 a{
color: var(--color1);
}
.grid-creos article p {
margin: 0 0 30px;
font-size: 1.4rem;
line-height: 1.4;
text-align: justify;
}
.grid-creos article .button{
margin-top: auto;
padding: .25rem 1.5rem;
font-size: 1.4rem;
width: fit-content;
}

/* 資料ダウンロード */
.post-type-archive-referenceroom {}

.loginstatus {
margin: 0;
padding: 30px;
display: flex;
justify-content: center;
gap: 60px;
background-color: var(--color3);
border-radius: var(--border-radius);
}

.loginform{
margin: 30px 0;
padding: 15px;
background-color: #fff;
border: 1px solid var(--color1);
}
.loginbox{
margin-bottom: 30px;
}
.loginform fieldset{
display: grid;
gap: 15px;
grid-template-columns: 7em 1fr 5em 1fr;
}
.loginform fieldset label{
display: grid;
align-items: center;
}
.button_div{
position: relative;
z-index: 2;
grid-column: 1 /5;
display: flex;
justify-content: center;
align-items: center;
}
.button_div input{
float: left;
}
.button_div input[type="submit"]{
margin-left: 0;
padding: 10px 40px;
font-size: 1.8rem;
font-weight: 600;
color: #fff;
background-color: var(--color4);
border-radius: 100px;
border: none;
box-shadow: 0px 0px 0px 5px rgb(160 192 103 /.25);
}
.link-text{
grid-column: 1/5;
text-align: center;
}

@media(min-width:601px){
.loginform .linkbtn{
text-align: center;
}
}


.downloads{
display: grid;
grid-template-columns: repeat(3 , 1fr);
gap: 30px;
margin: 0 0 90px;
}
.downloads > div{
padding: 30px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}
.downloads div h2{
margin: 0 0 15px;
font-size: 2rem;
text-align: center;
}
.downloads div img{
display: block;
margin: 0 auto 30px;
aspect-ratio: 16 / 9;
object-fit: cover;
border-radius: var(--border-radius);
}
.downloads div .linkbtn{
text-align: center;
}

@media(max-width:600px){
.downloads{
grid-template-columns: repeat(2 , 1fr);
gap: 30px;
margin: 0 0 90px;
}
}

.ref-list{
display: grid;
grid-template-columns: repeat(3 , 1fr);
gap: 60px;
margin: 0 0 90px;
}
.ref-list div .mateimg,
.ref-list div img{
aspect-ratio: 2 / 1;
object-fit: cover;
display: block;
margin: 0 auto 15px;
border-radius: var(--border-radius);
}
.mateinner{
display: flex;
flex-direction: column;
padding: 30px;
height: 100%;
background-color: #fff;
border-radius: var(--border-radius);
}
.mateinner h3{
margin: 0 0 15px;
text-align: center;
}
.mateinner p{
margin: 0 0 15px;
text-align: justify;
}
.downloadlinks{
margin-top: auto;
}

.page-id-954 #wpmem_login fieldset {
margin: 0px auto;
width: fit-content;
}
.page-id-954 #wpmem_login fieldset .button_div{
margin-top: 15px;
}

.page-id-954 #wpmem_login fieldset  input[type="text"],
.page-id-954 #wpmem_login fieldset  input[type="password"]{
margin: 0 0 30px;
text-align: left;
padding: 5px;
background-color: rgb(71 170 179 /.25);
border: none;
border-radius: 4px;
}


/* 検索結果 */
.search-results{}
.search-results .site-main{
margin: 0 0 90px;
}
.search-results .site-main article{
padding: 15px 0;
border-top: 1px solid rgb(71 170 179 /.35);
display: grid;
grid-template-columns: 300px auto;
}
.search-results .site-main article .entry-header{
margin: 0;
}
.search-results .site-main article .entry-header h2{
font-size: 2rem;
}
.search-results .site-main article .entry-header h2 a{
color: var(--color2);
}


/* Creosの知識箱 SINGLE*/
.single-post{}
.single-post h1{
margin: 0 0 30px;
padding: 30px;
font-size: 2.4rem;
line-height: 1.5;
color: var(--color5);
background-color: #fff;
transform: translate(120px ,120px);
width: 90%;
box-shadow: rgb(71 170 179 /.2) 0px 8px 24px;
}
.single-post .entry-meta{
margin: 0 0 30px;
}
.single-post img{
margin: 0 auto 15px;
border-radius: var(--border-radius);
}
.single-post h2{
margin: 60px auto 15px;
padding: 10px;
color: var(--color8);
max-width: 20ch;
text-align: center;
}
.single-post h3{
margin: 30px 0 15px;
padding: 1rem;
border-width: 0px 1px 1px 0;
border-style: solid;
border-color: var(--color8);
color: var(--color8);
}
.single-post h4{
margin: 30px 0 15px;
padding-left: 1rem;
color: var(--color2);
border-left: 3px solid var(--color1);
}

/* 目次 */
div#ez-toc-container{
margin-top: 30px;
width: 100%;
border: 3px solid var(--color3);
}
div#ez-toc-container .ez-toc-title {
font-size: 100%;
}
div#ez-toc-container ul li, div#ez-toc-container ul li{
margin-bottom: 5px;
}
div#ez-toc-container ul li,
div#ez-toc-container ul li a {
font-size: 100%;
font-weight: 500;
}
div#ez-toc-container nav ul ul li {
font-size: 90%;
font-weight: 500;
}
#ez-toc-container ul ul{
margin-bottom: 5px;
}

/* POST NAVIGTION*/
.post-navigation{
margin: 90px 0;
}
.nav-links {
display: grid !important;
grid-template-columns: repeat(2,1fr);
gap: 60px;
}
.post-navigation a{
position: relative;
display: block;
height: 100%;
padding: 30px;
color: var(--color4);
background-color: #fff;
border: 1px solid var(--color4);
}
.post-navigation a:hover{
color: #fff;
background-color: var(--color4);
}
.post-navigation a .fa{
display: inline-block;
width: 40px;
height: 40px;
padding: 10px;
color: #fff;
background-color: var(--color4);
border-radius: 50%;
text-align: center;
}
.post-navigation a:hover .fa{
color: var(--color4);
background-color: #fff;
}

.nav-previous .fa{
margin-right: 1em;
}
.nav-next .fa{
position: absolute;
right: 30px;
margin-left: 1em;
}

/*MEMBER*/
#wpmem_reg{
margin: 0 0 90px;
padding: 30px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}
#wpmem_register_form input[type="text"],
#wpmem_register_form input[type="email"]{
margin-bottom: 10px;
width: 100%;
padding: 5px;
background-color: rgb(71 170 179 /.25);
border: none;
border-radius: 4px;
}
.div_checkbox{
margin: 0 auto 15px;
text-align: center;
}
#wpmem_pwdreset_form{
margin: 0 0 90px;
}
#wpmem_pwdreset_form fieldset{
text-align: center;
}
#wpmem_pwdreset_form input[type="text"]{
margin: 0 0 30px;
text-align: left;
padding: 5px;
background-color: rgb(71 170 179 /.25);
border: none;
border-radius: 4px;
}

.register_status{
margin: 0 0 15px;
}

.register_links li:first-child a{}
.register_links li:last-child a{}

.register_links li:first-child{
margin: 0 0 15px;
}

.register_links li:first-child a{
position: relative;
margin: 0 0 10px;
display: inline-block;
padding: .375rem 3rem;
color: #fff;
background-color: #6c6c6c;
border-radius: 100px;
box-shadow: 0px 0px 0px 8px rgb(0 0 0 /.25);
}
.register_links li:first-child a:hover{
color: #3c3c3c;
background-color: #fff;
}
.register_links li:first-child a::before{
content: "";
position: absolute;
transition: .3s ease-in;
transition-delay: 0.1s;
right: 20px;
top: 49.5%;
display: block;
width: 0;
height: 1px;
background-color: var(--color1);
transform-origin: left;
}
.register_links li:first-child a:hover::before{
right: -15px;
width: 30px;
}

.register_links li:last-child a{
position: relative;
margin: 0 0 10px;
display: inline-block;
padding: .375rem 3rem;
color: #fff;
background-color: var(--color1);
border-radius: 100px;
box-shadow: 0px 0px 0px 8px rgb(71 170 179 /.25);
}
.register_links li:last-child a:hover{
color: var(--color1);
background-color: #fff;
}
.register_links li:last-child a::before{
content: "";
position: absolute;
transition: .3s ease-in;
transition-delay: 0.1s;
right: 20px;
top: 49.5%;
display: block;
width: 0;
height: 1px;
background-color: var(--color1);
transform-origin: left;
}
.register_links li:last-child a:hover::before{
right: -15px;
width: 30px;
}

/* 404 */
.error404 {}
.error404 {}
.error404 .allttlsec{
margin: 0 0 90px;
}
.error404 .allttlsec h1{
margin-bottom: 30px;
}
.error404 .allttlsec p{
margin-bottom: 90px;
}

/* RWD */
@media(max-width:991px) {
.button {
text-align: center;
padding: .375rem 1.5rem;
}
.button::before{
content: none;
}
.offcanvas-body{
background-color: var(--color1);
}
.nav-link{
color: #fff;
font-size: 1.8rem;
font-weight: 600;
}
.serch-form{
display: none;
}
.navbar-toggler-icon {
width: 48px;
height: 48px;
background-image: url(images/burgermenu.svg);
}
.navbar-toggler{
position: fixed;
top: 15px;
right: 5px;
padding-left: 0 !important;
padding-right: 0 !important;
border: none;
}
.offcanvas-header .btn-close {
margin-top: 15px;
margin-right: 5px;
}

#wrapper-footer {
margin-top: 200px;
}
.footer_ourworks {
grid-template-columns: 100px 1fr;
gap: 15px;
}
.footer-cta {
margin: -140px 0 6rem;
}
.footer-cta a{
padding: 2rem 0;
}
.footer-cta a::before {
left: 15px;
width: 60px;
height: calc(100% - 80px);
}
.footer-nav_child li{
font-size: 1.4rem;
}
.home .hero .mv {
grid-template-columns: 1fr 240px;
}
.home .hero .mv div {
transform: translate(-30px , 0);
}
.news-topics .col-12 {
margin: 0;
padding: 0;
display: grid;
grid-template-columns: 1fr;
}
#footer_canvas-container {
top: -280px;
}
.case-studies {
margin: -300px 0 90px;
}
.ul_case-studies {
grid-template-columns: repeat(3, 1fr);
}
.our-services-contents {
gap: 10px;
}
.our-services-contents article {
padding: 10px;
}
.our-services-contents article:nth-child(4) {
grid-column: 1 / 4;
background-color: transparent;
padding: 0;
margin-top: 30px;
}
.our-services-contents article:nth-child(5) {
padding: 0;
}
.our-services-contents article:nth-child(6) {
padding: 0;
}
}
@media(max-width:834px) {
.navbar {
padding: 0;
}
.navbar .container{
max-width: 100%;
padding-left: 0;
padding-right: 0;
}
.navbar-toggler{
border: none;
}
.page-id-399 .productions h2{
left: 5px;
top: -15px;
}
}

@media(max-width:768px) {
.footer-cta a::before {
top: -35px;
left: 0;
right: 0;
margin: 0 auto;
width: 60px;
height: 60px;
background-color: #fff;
border: 10px solid var(--color1);
border-radius: 50%;
}
.footer-cta a:hover::before {
border: 10px solid var(--color4);
}
.home .hero .mv {
grid-template-columns: 1fr 180px;
}
.home .hero .mv div {
transform: translate(-10px , 0);
}
}

@media(max-width:600px) {
.button{
font-size: 1.6rem;
}
.site-footer {
display: block;
}
.footer-cta {
grid-column: 1 / 3;
margin: -120px 0 6rem;
display: grid;
gap: 30px;
grid-template-columns: 1fr;
}
.footer-cta_phone .phone,
.footer-cta_phone .time,
.footer-cta_phone .caution{
text-align: center;
}

.external-site{
display: block;
margin: 0 auto 60px;
text-align: center;
}
.external-site img{
display: block;
margin: 0 auto;
}
.footer_ourworks {
margin: 0 0 60px;
grid-template-columns: 100px 1fr;
gap: 15px;
}
.footer-utility_list {
margin: 0 0 3rem;
padding: 3rem 5px;
display: grid;
grid-template-columns: repeat(2 ,1fr);
gap: 10px;
}
.footer-utility_list li{
margin-bottom: 5px;
border-bottom: 1px solid rgb(255 255 255 /.5);
}
.footer-utility_list li a{
display: block;
width: 100%;
padding: 5px;
}
.footer-utility_list li:last-child{
border: none;
}

.home .wrapper{
padding-top: 0;
}
.home .hero .mv {
display: block;
grid-template-columns: 1fr;
}
.home .hero video{
margin-top: -15px;
margin-bottom: 30px;
margin-left: -7.5px;
}
.home .hero .mv > img{
max-width: 100%;
margin-bottom: 15px;
}
.home .hero .mv div {
transform: translate(0 , 0);
}
.home .hero .mv div img{
max-width: 75%;
display: block;
margin: 0 auto;
}
.home .introduction {
font-size: 1.6rem;
}
#canvas{
margin-top: -200px;
z-index: -1;
}

.ul_case-studies img{
padding: 5px;
}
.our-services-contents {
display: block;
}
.our-services-contents article{
margin: 0 0 30px;
box-shadow: 0px 0px 20px  rgb(71 170 179 /.15);
}
.our-services-contents article:nth-child(4),
.our-services-contents article:nth-child(5),
.our-services-contents article:nth-child(6) {
padding: 10px;
background-color: rgb(255 255 255 /.5);
border-radius: var(--border-radius);
}
.our-services-contents article:nth-child(4),
.our-services-contents article:nth-child(5),
.our-services-contents article:nth-child(6){
display: block;
}
.our-services-contents article .button{
display: block;
margin:0 auto 10px;
width: calc(100% - 10px);
}
.casedetails {
margin: 0 0 30px;
padding: 10px;
}
.totalinfo .col-md-4,
.totalinfo .col-md-8{
padding: 15px;
}
.totalinfo .col-md-12 h2{
padding: 15px;
}
.companysec th{
width: 1%;
white-space: nowrap;
border-bottom: 1px solid var(--color3);
}
.companysec td {
width: auto;
}
}


/* FluentCRM用 */
body.fc_unsub, .fluentcrm_unsubscribe_wrapper{
background:#bbdbd8 !important;
}

/* 配信停止の英文翻訳 */
.fluentcrm_success{
font-size:0 !important;
margin:1rem auto -1rem;
}
.fluentcrm_success::before{
content:"配信停止の手続きが完了しました。";
display:block;
font-size:clamp(1.4rem, 1.33rem + 0.19vw, 1.6rem);
}


/* パスワード変更ページ（new_password）制御 */
body.page-id-954 .link-text-forgot, body.page-id-954 #rememberme, body.page-id-954 label[for="rememberme"]{
display:none;
}
body.page-id-954 .entry-content  ul{
display:none;
}
