/*------------------------------------------------------------
BODY BASIC
------------------------------------------------------------*/
body{
font-size:3.5vw;
line-height:1.75;
color:#222;
font-weight:500;
letter-spacing:.06em;
font-feature-settings:'palt';
}

/*------------------------------------------------------------
RESPONSIVE
------------------------------------------------------------*/
.pconly{ display:none; }
.sponly{ display:block; }


/*------------------------------------------------------------
	BUTTON
------------------------------------------------------------*/

.links{
display:flex;
justify-content:flex-end;
}
.links li{
margin-right:8vw;
}
.links li a{
display:inline-block;
padding:0 6vw 4vw 0;
color:#222;
font-weight:bold;
position:relative;
}
.links li a::before{
content:'';
width:100%;
height:1px;
background:#222;
position:absolute;
bottom:0;
left:0;
}
.links li a::after{
content:'';
width:4vw;
height:1px;
background:#222;
transform:rotate(60deg);
position:absolute;
bottom:1.6vw;
right:-1.2vw;
transition:all .2s;
}

.links li a:hover::after{
right:-2.1vw;
}
.links li a:hover::before{
left:1vw;
}
.links li a:hover{
background: linear-gradient(to right, #30cfd0 0%, #330867 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.link{
display:flex;
}
.link-right{
justify-content:flex-end;
}


.link a{
display:inline-block;
padding:0 6vw 2vw 0;
color:#222;
font-weight:bold;
position:relative;
}
.link a::before{
content:'';
width:100%;
height:1px;
background:#222;
position:absolute;
bottom:0;
left:0;
}
.link a::after{
content:'';
width:4vw;
height:1px;
background:#222;
transform:rotate(60deg);
position:absolute;
bottom:1.6vw;
right:-1.2vw;
}

/*------------------------------------------------------------
HEADER
------------------------------------------------------------*/
header{
width:100%;
height:12vw;
position:fixed;
top:0;
left:0;
z-index:10;
}

header.scrolled .site-name,
header.scrolled .h-nav a {
  color: #222;
}

header.scrolled {
}
.site-name{
font-family:'Poppins';
font-weight:700;
color:#fff;
font-size:6vw;
line-height:1;
position:absolute;
top:3vw;
left:4vw;
z-index:2;
}
.site-name span{
display:block;
font-size:2.5vw;
line-height:2;
}
.site-name a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}




/*------------------------------------------------------------
DRAWER MENU
------------------------------------------------------------*/
#menuBtn{
position:fixed;
right:4vw;
top:6.25vw;
width:6vw;
height:4.5vw;
cursor:pointer;
z-index:9999;
}
#menuBtn span{
display:block;
position:absolute;
height:.5vw;
width:100%;
background:#fff;
left:0;
transition:all 0.2s ease-in-out;
}

#menuBtn span:nth-child(1){
top:0;
}
#menuBtn span:nth-child(2){
top:2vw;
}
#menuBtn span:nth-child(3){
top:4vw;
}

.active#menuBtn span:nth-child(1){
top:2vw;
transform:rotate(45deg);
background:#fff;
}
.active#menuBtn span:nth-child(2){
width:0;
left:50%;
}
.active#menuBtn span:nth-child(3){
top:2vw;
transform:rotate(-45deg);
background:#fff;
}

header.scrolled #menuBtn span{
background:#222;
}


#menuBox{
display:none;
width:100%;
background:rgba(0,0,0,.65);
height:100dvh;
position:fixed;
top:0;
left:0;
box-sizing:border-box;
z-index:9998;
}

#menuBox.active{
display:block;
}

.menuInner{
transform:translate(-5vw, 0);
opacity:0;
transition:all .3s;
display:flex;
justify-content:center;
align-items:center;
flex-wrap:wrap;
height:100dvh;
}
.menuInner.active{
transform:translate(0,0);
opacity:1;
}



.sp-menu{
width:70vw;
margin:0 auto;
}
.sp-menu li{
position:relative;
}

.sp-menu li a{
padding:1vw 0;
display:block;
background-image: linear-gradient(to right, #fdfbfb 0%, #ebedee 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-family:'Poppins';
font-weight:700;
font-size:6.5vw;
display:inline-block;
}
.spMenu li a span{
display:inline-block;
margin-left:2vw;
font-size:3vw;
color:#abc;
}



/*------------------------------------------------------------
TOPPAGE
------------------------------------------------------------*/
#kv{
width:100%;
height:100vh;
position:relative;
}

.video-container {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.video-container video {
  width: 100.5%;
  height: 100%;
  object-fit: cover;
}




.content-section{
background:#fff;
width:100%;
position: relative;
z-index: 1;
}


.inner{
width:90vw;
margin:0 auto;
padding:12vw 0;
position:relative;
z-index:2;
}

.content-section h2{
font-family:'Poppins';
font-weight:700;
font-size:6.5vw;
line-height:1.35;
margin-bottom:1em;
}

.index-ttl {
  display: inline-block;
  
}
.index-ttl em {
font-style: normal; 
  display: inline-block;
  opacity: 0;
  /*transform: translateY(30px) rotateX(90deg) skew(10deg); */
  transition:all 0;
}

.index-ttl.inview em {
  opacity: 1;
  transform: translateY(0) skewY(0deg) rotateX(0deg);
}


.split {
  position: relative;
  height: 75vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.split-bg-a {
background-image:url(img/spider-web2-sp.webp);
}
.split-bg-b {
background-image:url(img/bg-development-sp.webp);
background-position:center bottom;
}


.lead01{
font-size:4vw;
margin-bottom:8vw;
}
.lead02{
font-size:3.5vw;
margin-bottom:9.6vw;
}

.lead{
font-size:4vw;
margin-bottom:16vw;
}



.needs{
display:flex;
flex-wrap:wrap;
gap:4vw 0;
margin-bottom:8vw;
}
.needs li{
width:100%;
padding:5vw 6vw;
background:#f8f8f8;
position:relative;
}

.needs li h3{
font-size:4.5vw;
line-height:1.35;
font-weight:bold;
margin-bottom:2vw;
}

.needs li:nth-child(1)::after{
content:'';
width:0;
height:0;
border-bottom:4vw solid #87CEEB;
border-left:4vw solid transparent;
border-right:4vw solid transparent;
transform:rotate(45deg);
position:absolute;
top:-.5vw;
right:-2.4vw;
z-index:2;
}

.needs li:nth-child(2)::after{
content:'';
width:0;
height:0;
border-bottom:4vw solid #66CDAA;
border-left:4vw solid transparent;
border-right:4vw solid transparent;
transform:rotate(45deg);
position:absolute;
top:-.5vw;
right:-2.4vw;
z-index:2;
}
.needs li:nth-child(3)::after{
content:'';
width:0;
height:0;
border-bottom:4vw solid #D8BFD8;
border-left:4vw solid transparent;
border-right:4vw solid transparent;
transform:rotate(45deg);
position:absolute;
top:-.5vw;
right:-2.4vw;
z-index:2;
}
.needs li:nth-child(4)::after{
content:'';
width:0;
height:0;
border-bottom:4vw solid #E9967A;
border-left:4vw solid transparent;
border-right:4vw solid transparent;
transform:rotate(45deg);
position:absolute;
top:-.5vw;
right:-2.4vw;
z-index:2;
}





.svc-menu{
display:flex;
flex-wrap:wrap;
gap:4vw 0;
}
.svc-menu li{
width:100%;
margin:0;
display:flex;
justify-content:space-between;
}
.svc-icon{
width:12vw;
}
.svc-cont{
width:72vw;
}

.svc-cont p{
margin-bottom:2em;
}


.svc-menu li h3{
font-size:5vw;
line-height:1;
margin-bottom:2vw;
}
.svc-menu li h3 span{
display:block;
font-size:3vw;
font-family:'Poppins';
font-weight:600;
color:#abc;
margin-top:1vw;
}


.exam{
margin-bottom:10vw;
}


.exam .ex-slide{
width:98%;
height:43vw;
border:1px solid #222;
padding:4vw 6vw;
display:flex;
flex-shrink:0;
position:relative;
}

.ex-slide a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:10;
}


.slick-slide{
margin:0 2vw;
}


.case-num{
display:flex;
justify-content:flex-end;
font-size:5vw;
line-height:1;
font-family:'Poppins';
font-weight:600;
color:#abc;
margin-bottom:2vw;
}
.case-ttl{
font-weight:bold;
font-size:5vw;
line-height:1.3;
margin-bottom:2vw;

}




.cta{
  position: relative;
  height: 90vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
position:relative;
background-image:url(img/contact-bg-sp.webp);
background-position:center bottom;
color:#fff;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
}

.cta::after{
content:'';
width:100%;
height:100%;
background:rgba(0,0,0,.35);
position:absolute;
top:0;
left:0;
}


.cta h2{
font-family:'Poppins';
font-weight:700;
font-size:6.5vw;
line-height:1.35;
margin-bottom:1em;
text-align:center;
display:block;

}

.lead .center{
text-align:center;
}


.c-btn{ text-align:center; }

.c-btn a{
color:#fff;
display:block;
padding:1rem 4rem;
width:auto;
border:1px solid #fff;
font-weight:bold;
font-size:1.1rem;
transition:all .2s;
}



/*------------------------------------------------------------
	PANKUZU
------------------------------------------------------------*/
#pankuzu{
width:90vw;
margin:0 auto;
font-size:2vw;
line-height:3;
padding:2vw 0;
}
#pankuzu .current{
font-weight:normal;
}

#pankuzu a{
color:#888;
text-decoration:underline;
}


/*------------------------------------------------------------
	PAGE
------------------------------------------------------------*/
#page-head{
display:flex;
justify-content:center;
align-items:center;
text-align:center;
}

#page-head h1{
font-size:6vw;
color:#fff;
font-weight:bold;
font-family:'Poppins';
position:relative;
z-index:3;
}

.teaser{
width:100%;
position:relative;
}

.t-about{
aspect-ratio: 828 / 540;
background-position: center top;
background-image:url(img/t-about-sp.jpg);
background-size:cover;
background-repeat:no-repeat;
color:#fff;
}

.t-services{
aspect-ratio: 828 / 540;
background-size:cover;
background-position: center top;
background-image:url(img/t-service2-sp.jpg);
background-repeat:no-repeat;
color:#fff;
}
.t-pricing-plans{
aspect-ratio: 828 / 540;
background-size:cover;
background-position: center top;
background-image:url(img/t-prices-sp.jpg);
background-repeat:no-repeat;
color:#fff;
}
.t-contact,
.t-confirm,
.t-complete,
.t-error{
aspect-ratio: 828 / 540;
background-size:cover;
background-position: center top;
background-image:url(img/t-contact-sp.jpg);
background-repeat:no-repeat;
color:#fff;
}
.t-portfolio{
aspect-ratio: 828 / 540;
background-position: center top;
background-image:url(img/t-portfolio2-sp.jpg);
background-repeat:no-repeat;
color:#fff;
background-size:cover;
}
.t-archives,
.t-news,
.t-column{
aspect-ratio: 828 / 240;
background-position: center top;
background-image:url(img/t-archive-sp.jpg);
background-repeat:no-repeat;
color:#fff;
background-size:cover;
}
.teaser::after{
content:'';
width:100%;
height:100%;
background:rgba(0,0,0,.15);
position:absolute;
top:0;
left:0;
z-index:2;
}



#page{
width:90vw;
margin:0 auto;
padding:12vw 0 0;
position:relative;
z-index:2;
}

#page section{
margin-bottom:12vw;
}

#page section p{
font-size:3.6vw;
margin-bottom:5.4vw;
}
#page section p:last-child{
margin:0;
}

#page h2.page-ttl{
font-size:7.5vw;
line-height:1.35;
font-weight:900;
margin-bottom:7.5vw;
}
#page h2.p-ttl{
font-size:6vw;
line-height:1.5;
font-weight:900;
margin-bottom:7.5vw;
}




#page h3.md01{
font-size:6vw;
line-height:2;
margin-bottom:7.5vw;
}

#page h3.md01 span{
color:#abc;
font-size:4vw;
margin-left:4vw;
display:inline-block;
}

.page-lead{
font-size:3.75vw;
font-weight:500;
margin-bottom:8vw;
}


.svc-list{
margin-bottom:8vw;
}

.svc-list li{
margin-bottom:4vw;
}

.svc-item{
font-size:4.5vw;
font-weight:bold;
}
.svc-pcont{
width:auto;
font-size:3.6vw;
}



.grad01{
font-size:5vw;
line-height:1.5;
font-weight:bold;
background-image: linear-gradient(to right, #5ee7df 0%, #b490ca 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.grad02{
font-size:5vw;
line-height:1.5;
font-weight:bold;
background-image: linear-gradient(to right, #3f51b1 0%, #5a55ae 13%, #7b5fac 25%, #8f6aae 38%, #a86aa4 50%, #cc6b8e 62%, #f18271 75%, #f3a469 87%, #f7c978 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.grad03{
font-size:5vw;
line-height:1.5;
font-weight:bold;
background: linear-gradient(to right, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.grad04{
font-size:5vw;
line-height:1;
font-weight:bold;
background-image: linear-gradient(to right, #5ee7df 0%, #b490ca 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


.comT{
width:100%;
}
.comT th{
text-align:left;
padding:2vw 0;
width:24vw;
vertical-align:top;
}
.comT td{
width:auto;
padding:2vw 0;
}

.t-en,
.t-cap{
font-size:3vw;
color:#888;
display:inline-block;
margin-left:1rem;
}


/* SERVICES */
.svc01,
.svc02,
.svc03,
.svc04{
display:flex;
justify-content:space-between;
}
.svc01-icon,
.svc02-icon,
.svc03-icon,
.svc04-icon{
width:13vw;
}
.svc01-icon svg,
.svc02-icon svg,
.svc03-icon svg,
.svc04-icon svg{
width:13vw;
height:auto;
}

.svc01-cont,
.svc02-cont,
.svc03-cont,
.svc04-cont{
width:calc(100% - 16vw);
}

h3.svc-ttl{
font-size:5vw;
font-weight:900;
line-height:2.5;
}

.svc-desc{
font-size:3.6vw;
line-height:1.75;
margin-bottom:1rem;
}

.svc-point{
font-size:3.6vw;
line-height:1.5;
margin-bottom:4vw;
}
.svc-point li{
position:relative;
padding-left:4vw;
margin-bottom:1vw;
}
.svc-point li::before{
content:'';
width:1vw;
height:1vw;
background-image: linear-gradient(120deg, #d9afd9 0%, #97d9e1 100%);
position:absolute;
top:2.2vw;
left:1vw;
transform:rotate(45deg);
}

.svc-bq{
padding:4vw 6vw;
border-radius:1.5vw;
background:linear-gradient(10deg, #efefef 0%, #f8f8f8 50%, #e2e2e2 100%);
}





/* PRICING & PLANS */

.plan{
margin:0 0 6vw;
}
.plan-name{
font-size:4vw;
line-height:1.35;
font-weight:bold;
margin-bottom:2vw;
}
.plan-dtl{
font-size:3.5vw
line-height:1.5;
margin:0 0 2vw;
}
.plan-price{
font-size:3.8vw;
line-height:1.5;
font-weight:bold;
text-align:right;
}

.plan-att{
padding:4vw 6vw;
border-radius:2vw;
background:linear-gradient(10deg, #efefef 0%, #f8f8f8 50%, #e2e2e2 100%);
}
.plan-att li{
padding-left:4vw;
position:relative;
font-size:3.6vw;
line-height:1.5;
}
.plan-att li::before{
content:'';
width:1vw;
height:1vw;
background:#ccc;
position:absolute;
top:2.2vw;
left:1vw;
}

.flows{
display:flex;
flex-wrap:wrap;
gap:0;
}
.flows li{
width:100%;
padding:0 0 8vw 14vw;
position:relative;
}

.flows li::before{
content: '';
width: 8vw;
height: 8vw;
background-image: linear-gradient(25deg, #d9afd9 0%, #97d9e1 100%);
position: absolute;
top: 0;
left: 2vw;
transform: translate(0, 0);
z-index: 2;
clip-path: polygon(
  50% 0%,
  100% 25%,
  100% 75%,
  50% 100%,
  0% 75%,
  0% 25%
);
}


.flows li::after{
content:'';
width:2px;
height:100%;
background:#f2f2f2;
position:absolute;
top:0;
left:calc(6vw - 1px);
z-index:1;
}

.flows li:last-child::after{
background:none;
}

.flows li p{
text-align:justify;
}



.flow-ttl{
font-size:4vw;
font-weight:bold;
line-height:1.5;
margin-bottom:3vw;
padding-top:1vw;
}




/*------------------------------------------------------------
	CONTACT MW WP FORM
------------------------------------------------------------*/
.req{
color:#cc2728;
font-size:3vw;
position:relative;
top:-1vw;
left:1vw;
}


.form {
width:100%;
font-size:3.6vw;
margin-bottom:8vw;
}
.form dt {
font-size:3.8vw;
line-height:1.5;
font-weight:bold;
margin:0 0 2vw;
}
.form dd {
margin:0 0 4vw;
}
.form dd:last-child{
margin:0;
}

input[type="text"],
input[type="email"]{
width:100%;
border-radius:1vw;
background:#f5f5f5;
padding:2vw;
box-sizing:border-box;
-webkit-appearance: none;
border:none;
}


textarea {
width:100%;
height:30vw;
border-radius:1vw;
padding:2vw;
box-sizing:border-box;
-webkit-appearance: none;
background:#f5f5f5;
border:none;
}

.mwform-checkbox-field label, .mwform-radio-field label{
display:inline-block;
margin:0 2vw 0 0 !important;
}
.mwform-checkbox-field input, .mwform-radio-field input{
margin:0;
}

.mw_wp_form .horizontal-item + .horizontal-item{
margin:0 !important;
}

input[type=radio]{
}


.formBtn {
display:flex;
gap:0 4vw;
}
.formBtn li {
display:inline-block;
font-size:3.8vw;
}

.mw_wp_form_confirm .formBtn input:hover,
.mw_wp_form_input .formBtn input:hover,
#submitback input:hover{
background-position: right center;
/*filter:hue-rotate(90deg); */
color:#fff;
}


.mw_wp_form_input .sbmBtn input {
background-image: linear-gradient(to right, #085078 0%, #85D8CE  51%, #085078  100%);
color:#fff;
width:40vw;
height:10vw;
overflow:hidden;
border:none;
cursor:pointer;
border-radius:1vw;
transition:all 0.2s;
font-weight:bold;
-webkit-appearance: none;
}
.mw_wp_form_confirm .sbmBtn input {
background-image: linear-gradient(to right, #085078 0%, #85D8CE  51%, #085078  100%);
color:#fff;
width:40vw;
height:10vw;
overflow:hidden;
border:none;
cursor:pointer;
border-radius:1vw;
transition:all 0.2s;
font-weight:bold;
-webkit-appearance: none;
}
.backBtn input {
background:#f2f2f2;
color:#222;
width:24vw;
height:10vw;
overflow:hidden;
border:none;
cursor:pointer;
border-radius:1vw;
transition:all 0.2s;
font-weight:bold;
-webkit-appearance: none;
}


/*------------------------------------------------------------
CATEGORY ARCHIVE
------------------------------------------------------------*/

.pf-list{
width:100%;
margin:0 auto;
}
.pf-list li{
padding:5vw 0;
position:relative;
}
.pf-thumb{
margin:0 auto 4vw;
}
.pf-info{
}
.pf-num{
font-size:5vw;
line-height:1;
font-family:'Poppins';
font-weight:600;
color:#abc;
margin-bottom:2vw;
}

h3.case-ttl{
font-size:5.5vw;
line-height:1.35;
font-weight:bold;
margin-bottom:2vw;
}
.case-lead{
font-size:3.5vw;
line-height:1.5;
margin-bottom:4vw;
}

.pf-btn {
  font-size: 3.5vw;
  font-weight: bold;
  line-height: 8vw;
  color: #333;
  text-decoration: none;
text-align:right;
}
.pf-btn a{
  font-size: 3.5vw;
  font-weight: bold;
  display: inline-block;
  padding: 0 12vw 0;
  position: relative;
  line-height: 8vw;
  background: linear-gradient(to right, #222 0%, #4682B4 100%);
  background-size: 200% 100%;
  background-position: 0 0;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  }
.pf-btn a::before{
content:'';
width:2vw;
height:2vw;
border-right:1px solid #4682B4;
border-bottom:1px solid #4682B4;
transform:rotate(-45deg);
position:absolute;
top:2.8vw;
right:3.3vw;
z-index:2;
}


.pf-btn a::after{
content:'';
width:8vw;
height:8vw;
border:1px solid #4682B4;
border-radius:50%;
position:absolute;
top: 50%;
right: 0;
transform: translateY(-50%) scale(1);
z-index:1;
}




/*------------------------------------------------------------
SINGLE
------------------------------------------------------------*/
#post-head{
display:flex;
justify-content:center;
align-items:center;
text-align:center;
}

#post-head h1{
font-size:6vw;
color:#fff;
font-weight:bold;
font-family:'Poppins';
position:relative;
z-index:3;
}
.p-teaser{
width:100%;
aspect-ratio: 828 / 240;
position:relative;
}

.p-portfolio{
background-position: center top;
background-image:url(img/p-teaser-port-sp.jpg);
background-size:cover;
background-repeat:no-repeat;
color:#fff;
}

.p-teaser::after{
content:'';
width:100%;
height:100%;
background:rgba(0,0,0,.15);
position:absolute;
top:0;
left:0;
z-index:2;
}


.post{
margin-bottom:12vw;
}


.p-col{
margin-bottom:10vw;
}
.p-thumb{
margin:0 auto 5vw;
}
.p-txt{

}


.case-post-num{
display:inline-block;
font-size:5vw;
font-weight:bold;
color:#abc;
}

.case-sub-ttl{
font-size:4vw;
line-height:1.35;
font-weight:bold;
}

.post h3{
font-size:5.5vw;
line-height:1.5;
margin-bottom:1rem;
}
.post h3 span{
font-weight:bold;
color:#abc;
display:inline-block;
margin-left:3vw;
font-size:3.5vw;
letter-spacing:0;
}
#page .post section{
margin-bottom:10vw !important;
}

.work-list{
font-size:3.6vw;
line-height:1.5;
margin-bottom:4vw;
}
.work-list li{
margin-bottom:1vw;
padding-left:4vw;
position:relative;
}
.work-list li::before{
content:'';
width:1vw;
height:1vw;
background:#888;
position:absolute;
top:2.2vw;
left:1vw;
}



.connect{
display:flex;
}
.connect-icon{
width:10vw;
height:10vw;
}
.connect-icon svg{
width:10vw;
height:10vw;
}

.connect-ttl{
margin:0 0 4vw 3vw;
font-size:5vw;
line-height:2;
font-weight:bold;
}


.connect-prj{
display:flex;
flex-wrap:wrap;
gap:4vw 0;
}
.connect-prj li{
margin:0;
border:1px solid #222;
padding:4vw 5vw;
position:relative;
}

.connect-prj li a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}




.archive{
margin-bottom:8vw;
}
.archive li{
padding:5vw 0;
}
.archive li:first-child{
padding-top:0;
}
.archive li:last-child{
padding-bottom:0;
}

.post-info{
display:flex;
align-items:center;
height:6vw;
margin-bottom:1rem;
}
.post-date{
font-size:2.5vw;
color:#888;
}
.post-cat{
margin-left:2rem;
}

h3.post-ttl{
font-size:5vw;
line-height:1.35;
margin-bottom:7.5vw;
}

.excerpt{
margin-bottom:5.25vw;
}

.post-cat a{
font-family:'Poppins';
font-weight:bold;
font-size:3.5vw;
color:#222;
position:relative;
top:-.5vw;
}




/*------------------------------------------------------------
FOOTER
------------------------------------------------------------*/

footer{
width:100%;
background:linear-gradient(to right, rgba(233, 236, 247, 0.3), rgba(255, 255, 255, 0.3));
}


.f-inner{
width:90vw;
margin:0 auto;
padding:12vw 0;
position:relative;
z-index:2;
}

.fcol{
display:flex;
flex-wrap:wrap;
gap:12vw 0;
}

.fcolL{
width:100%;
}
.f-menu{
}
.fm-ttl{
font-size:3vw;
line-height:2;
padding-left:5vw;
position:relative;
font-weight:bold;
margin-top:1vw;
}

.fm-ttl::before{
content:'';
width:3vw;
height:2px;
background:#888;
position:absolute;
top:50%;
left:0;
transform:translate(0, -50%);
}

.fm-ttl a{
color:#222;
}

.fm-dtl{
display:flex;
margin:0 0 2vw 5vw;
}
.fm-dtl li{
margin-right:4vw;
font-size:3vw;
color:#888;
font-weight:500;
}

.tool{
margin-top:6vw;
}
.tool-list{
display:flex;
font-size:2.5vw;
line-height:2;
color:#222;
font-weight:500;
}
.tool-list li{
margin-right:6vw;
padding-left:4vw;
position:relative;
}
.tool-list li:nth-child(1)::before{
content:'';
width:3vw;
height:3vw;
background:url(img/cpa-site-icon.png) no-repeat;
background-size:3vw;
position:absolute;
top:1vw;
left:0;
}
.tool-list li:nth-child(2)::before{
content:'';
width:3vw;
height:3vw;
background:url(img/icon-px-vw-tool.svg) no-repeat;
background-size:3vw;
position:absolute;
top:1vw;
left:0;
}
.tool-list li a{
color:#222;
}





.fcolR{
width:100%;
}
.f-com-name{
font-family:'Poppins';
font-weight:700;
color:#222;
font-size:6vw;
line-height:1.2;
margin-bottom:1vw;
position:relative;
}
.f-com-name a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:10;
}

.f-com-name span{
display:block;
font-size:2.5vw;
line-height:2;
}

.f-catch{
font-size:2.5vw;
font-weight:500;
margin-bottom:6vw;
}

.f-info li{
font-size:2.5vw;
line-height:2;
display:flex;
}

.f-icon{
width:1em;
height:1em;
color:#888;
margin-right:.5em;
}
.f-icon svg{
width:1em;
height:1em;
}

.copy{
width:90vw;
margin:0 auto;
text-align:center;
font-size:2vw;
line-height:2;
color:#888;
font-family:'Poppins';
padding:1vw 0;
}