@charset "UTF-8";


/* common */

html {font-size: 16px!important;font-weight: 600;}
h1, h2, h3, h4, h5, h6 {line-height: 1.6;}
body , .section , h1 { margin: 0; padding: 0; box-sizing: border-box;
font-family: "Noto Sans JP", sans-serif;font-optical-sizing: auto;font-style: normal;}
img { display: block; width: 100%; }
li { list-style: none; display: inline-block;padding: 0 1vw 10px;}
a { text-decoration: none; color: #ffffff; }


/*メディアクエリ切り分け*/

/*pc*/
.pc{display: block!important;}
.sp{display: none!important;}

/*SP*/
@media screen and (max-width: 960px) {
.pc{display: none!important;}
.sp{display: block!important;}  
}

h2 {font-size: clamp(1.5rem, 3.3vw, 3.3rem);margin: 0;color: #ffffff;text-shadow: 8px 0px 26px rgb(56 101 151);}
.power {font-size: 0.8rem;font-weight: 400;display: block;margin-bottom: 5%;margin-top: 15px;}
p{line-height: 1.75;font-weight: 500;}

/* header */
header { position: fixed; width: 100%; top: 0; left: 0; z-index: 99999; color: #fff;
background-color: #fff;padding-bottom: 8px;box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.05);
transform: translateY(0px);transition: .65s;}
header img { width: 72%;transition: .2s;}

/*パンくず　activeの時の挙動*/

.h-active{transform: translateY(-27px); }

/*グロナビ　activeの時の挙動*/

.h-active{transform: translateY(-27px); }
.g-active img{width: 58%;}
.g-active nav a {font-size: 0.85rem;}


/* fv */
#fv{position: relative;z-index: 2;padding: 11% 0;background-color: #3c86da; ;
background-image: url(/enterpri/category7/ad/images/main_v.png); /* パスは調整してね */background-position: center center;background-repeat: no-repeat;background-size: 100vw auto;
background-position: bottom;}
nav a{font-weight: 800;color: #101010;transition: 0.15s;transform: translateY(0px);display: inline-block;font-size: clamp(6px, 1.25vw, 15px)}
nav a:hover {transform: translateY(2.5px);display: inline-block;}

.front { position: relative; top: 0; left: 0; z-index: 2; }
.back { position: absolute; top: 0; left: 0; z-index: 1; }
.inner { display: flex; max-width: 1300px; margin: 0 auto;padding: 10px 15px 0px 15px;}
.item-left { width: 15%; }
.item-center { width: 70%; display: flex; align-items: center; }
.item-right { width: 15%; }
#fv { position: relative; }
.fv-container {width: 90%; padding-top: 4%; margin: 0 auto; top: 0; right: 0; bottom: 0; left: 0; max-width: 1460px; }
.fv-inner { display: flex; align-items: center;}
.fv-inner .item { width: 55%; }
.icon img { width: 32%; display: inline-block; }
.heading { padding: 0% 1% 0; box-sizing: border-box; }
 .heading p {color: #fff;font-size: 0.95rem;font-size: clamp(0.6rem, 1vw, 1.1rem);padding-right: 12%;margin-top: 5%;}

/* cta */
.cta_box { display: flex; flex-wrap: wrap; align-items: center; text-align: center; margin-top: 10%; gap: 15px; }
.cta_requ { width: 45%; box-sizing: border-box; background-color: #f9c81c; padding: 2.5%; border: 2px solid #f9c81c;border-radius: 5px;
color: #101010; font-weight: 800; font-size: 0.9rem; box-shadow: 5px 7px 8px 0px rgba(0, 0, 0, .5);position: relative;transition: .18s;transform: translateY(0px);}

.cta_requ::after { content: ""; display: inline-block; vertical-align: middle; background-image: url(/enterpri/category7/ad/images/arrow.png); width: 15px; height: 15px; background-repeat: no-repeat; background-size: contain;margin-bottom: 4px;position: relative;
left: 10px;}
.cta_dl { width: 45%; box-sizing: border-box;background-color: #266fc4; padding: 2.5%; border-radius: 5px; color: #ffffff; font-weight: 700; font-size: 0.9rem; box-shadow: 5px 7px 8px 0px rgba(0, 0, 0, .5); border: 2px solid #f9c81c;transition: .18s;transform: translateY(0px);}
.cta_dl::after { content: ""; display: inline-block; vertical-align: middle; background-image: url(/enterpri/category7/ad/images/down.png); width: 15px; height: 15px; background-repeat: no-repeat; background-size: contain;margin-bottom: 4px;position: relative;
left: 10px;}
.item-center li::after { content: ""; display: inline-block; vertical-align: middle; background-image: url(/enterpri/category7/ad/images/down_arrow.png); width: 15px; height: 15px; background-repeat: no-repeat; background-size: contain; margin-left: 12px; margin-bottom: 4px;}

.cta_requ:hover{transform: translateY(4.3px);}
.cta_dl:hover{transform: translateY(4.3px);}


/*吹き出し*/

.cta_requ::before{content:"";position:absolute;top:-28px;left:50%;transform:translateX(-50%);width:210px;height:40px;background-image:url(/enterpri/category7/ad/images/hukidashi01.png);background-size:contain;background-repeat:no-repeat;background-position:center;z-index:2;animation:pikopiko 1s infinite ease-in-out}
@keyframes pikopiko{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-4px)}}
.cta_dl::before{content:"";position:absolute;top:-40px;left:50%;transform:translateX(-50%);width:245px;height:40px;background-image:url(/enterpri/category7/ad/images/hukidashi02.png);background-size:contain;background-repeat:no-repeat;background-position:center;z-index:2}


/* 特徴 */

#feature{padding: 12% 10% 3%; max-width: 1300px; margin: 0 auto; z-index: 1;}
#feature p{font-size: 2.65rem; max-width: 800px; margin: 0 auto; min-height: 77px;}
.des{font-size: 1rem !important; margin-top: 3% !important;}
.des span{display: inline-block;}
.philosophy{position: relative; z-index: 1; overflow: hidden;}
.philosophy img{width: 100vw; display: block; background-size: 110%; background-position: center; animation: kenBurns 50s ease-in-out infinite alternate; position: relative; z-index: -1;}
.philosophy .inner{max-width: 650px; display: block; position: absolute; right: 50%; bottom: 0; margin: 0 auto; overflow: hidden; width: 100%; top: 45%; left: 50%; transform: translate(-50%, -50%);}
.philosophy p{text-align: center; font-size: clamp(1rem, 2.8vw, 2.8rem); margin-bottom: 2%; font-weight: 600; font-style: normal; color: #2072d2; text-shadow: 9px 3px 26px #fff;}

.feature { display: flex; margin-top: 0%; }
.feature .item { width: 33%; padding: 23px; }
.feature .item p { font-size: 0.9rem !important;}
.feature span { font-size: 0.70rem;line-height: 1.8;display: inline-block;}
h3 { font-size: clamp(1.2rem, 3vw, 3rem);text-align: center; font-weight: 600;color: #3c86da;}
h4 { text-align: center;font-size: clamp(0.8rem, 1.8vw, 1.8rem); min-height: 75px; margin-bottom: 0px;color: #3c86da;}
h4 span {display: block !important;font-size: 0.95rem !important;font-weight: 600;line-height: 1 !important;margin-top: 2% !important;}
.feature img { width: 90%; display: block; margin: 0 auto; }
.kome {display: inline-block !important;font-size: 0.75rem !important;position: relative;right: -4px;}


/* 事例 */

#case { padding: 16% 10% 7%; max-width: 1300px; margin: 0 auto;}
#case p { font-size: clamp(0.8rem, 1.8vw, 1.8rem); max-width: 800px; margin: 0 auto;}
#case p span {font-size: 0.65rem;display: block;margin-top: 4%;}
.case { display: flex;padding-top: 4%;gap: 41px;}
.case .item { width: 33%;padding: 5% 3% 4%;box-shadow: 5px 7px 8px 0px rgba(0, 0, 0, .5);border: 1px solid #e9e9e9;border-radius: 10px;}
.case .item p { font-size: 0.9rem !important;}
.case span { font-size: 0.70rem; }
.case img {width: 100%;display: block;margin: 0 auto;padding: 12% 2%;box-sizing: border-box;}
.caselist {padding: 0;}
.caselist span{font-size: 0.85rem; font-weight: 600; background-color: #fff; display: block; width: fit-content; padding: 2px 6px; border: 1px solid #000; margin-bottom: 10px; border-radius: 3px;}
.inc{border: none !important; font-size: 1rem !important; padding: 0 !important;}
.caselist li{padding: 0; display: block; font-size: .85rem; font-weight: 500;margin-bottom: 5%;}
.subcopy{position: relative; min-height: 0 !important; font-weight: 600; text-align: center; color: #3c86da;}


.kai {
line-height: 1.5;display: inline !important;position: unset !important;font-weight: 600;text-align: center !important;color: #3c86da !important;
font-size: clamp(0.8rem, 1.8vw, 1.8rem)!important;margin: 0 !important;}

/*パンくず*/

.subcopy span{font-size: 0.7rem; position: absolute; right: 8px; bottom: -19px; color: #000;}
.breadcrumbs{color: #000000; font-size: 0.7rem; padding: 6px 10px 6px 10px; font-weight: 500; background-color: #efefef; transition: .4s;}
.breadcrumbs a{color: #000000; text-decoration: underline;}


/* 各セクションのCTA */

#cta { background-color: #f6f6f6; padding: 4% 0; }
#cta .inner { display: block; max-width: 730px; padding: 10px; }
#cta .cta_box { justify-content: center; margin: 0 auto; }

/* 提供媒体 */

#offer { padding: 19% 10% 8%; margin: 0 auto;}
#offer .inner {max-width: 1300px;margin: 0 auto;display: block;padding: 0;}
#offer p { font-size: 0.9rem; max-width: 640px;color: #fff;}

.media-heading {margin-top: 30px;min-height: 0 !important;margin-bottom: 20px !important;font-weight: 600;font-size: clamp(1.2rem, 1.6vw, 1.3rem) !important;line-height: 1.6;}

.offer { display: flex;}
.offer .item { width: 33%; padding: 10px 22px;}
.offer span {font-size: 0.70rem;line-height: 1.8;display: inline-block;margin-top: 5%;font-weight: 400;    color: #fff;}
.offer img { width: 85%; display: block; margin: 0 auto 20px; }
.more { width: 60%; box-sizing: border-box; background-color: #ffffff; padding: 2.5%; border: 1px solid #010101; border-radius: 5px; color: #010101; font-weight: 800; display: block; font-size: 0.9rem; text-align: center; box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, .5); position: relative; margin: 21px auto 18px;transition: .2s;}
.more::after { content: ""; display: inline-block; vertical-align: middle; background-image: url(/enterpri/category7/ad/images/arrow.png); width: 10px; height: 10px; background-repeat: no-repeat; background-size: contain; margin-bottom: 4px; position: relative; left: 10px; }
.view { color: #000000; text-decoration: underline; }
.more:hover {transform: translateY(4.3px);}
.offer h4 {color: #fff;}


/* ご利用の流れ */

#flow { padding: 18% 10% 5%; max-width: 1300px; margin: 0 auto;}
#flow p { font-size: 1.5rem; max-width: 640px; margin: 0 auto; font-weight: 500;
 min-height: 77px;margin-top: 7%;}
.flow { display: flex;}
.flow .item { width: 33%; padding: 23px; }
.flow .item p { font-size: 0.9rem !important;}
.flow span { font-size: 0.70rem;font-weight: 400;}
.precautions {display: block;margin-top: 7%;}
.flow img { width: 55%; display: block; margin: 0 auto; }
span.exp { display: block; font-size: 0.95rem; margin-top: 7px;color: #000;}
.label img { width: 55%;margin-top: 4%;}


/* よくある質問------------------------------ */

#qalist {background-color: #f6f6f6;margin-top: 10%;padding: 3% 13px 7%;}
#qalist h2{margin: 12% 0 10%!important;color: #fff;font-weight: 700;}
#qalist h2::after{background-color: #fff;}
.quest{position: absolute;top: -14px;left: 19px;background-color: #3c86da;width: 45px;height: 45px;display: flex;justify-content: center;align-items: center;
 font-size: 20px;border-radius: 100px;color:#cfe5ff;font-weight: 900;font-weight: 900;font-family: "Roboto", sans-serif;font-optical-sizing: auto;font-style: normal;font-size: 1.5rem;font-style: italic;}
/* アコーディオンリスト全体を囲うタグ */
.accordion_wrapper{margin-top: 50px;max-width: 1000px;margin: 0 auto;  box-sizing: border-box;}
/* 個々のアコーディオンリストを囲うタグ */
.accordion{margin: 0 auto;position: relative;}
/* アコーディオンのタイトル・内容共通 */
.accordion_header,.accordion_content{display: flex;align-items: center;padding: 15px 48px 15px 74px;font-weight: 400;margin: 0;}
/* アコーディオンのタイトル */
.accordion_header{cursor: pointer;background-color: #ffffff;color: #0f0f0f;position: relative;font-weight: 700;border-radius: 100px;font-size: clamp(0.6rem, 1.6vw, 1.3rem);}
/* アコーディオンの内容 */
.accordion_content{display: none;color: #000;font-size: 0.8rem;padding: 15px 10px 12px 62px;position: relative;  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;}
.accordion_header:nth-child(n + 1){margin-top: 40px;}
/* タイトル横のプラスマーク縦線 */
.accordion_header::before{position: absolute;content: '';top: 50%;right: 29px;width: 10px;height: 1.5px;background-color: #000;transform: rotate(90deg);transition: all .3s ease-in-out;}
/* タイトル横のプラスマーク横線 */
.accordion_header::after{position: absolute;content: '';top: 50%;right: 29px;width: 10px;height: 1.5px;background-color: #000;transition: all .3s ease-in-out;}
/* アコーディオンが開いたとき縦線の変化 */
.accordion_header.open::before{transform: rotate(180deg);}
/* アコーディオンが開いたとき横線の変化 */
.accordion_header.open::after{opacity:0;}
.answ{position: absolute;top: 10px;left: 19px;width: 45px;height: 45px;display: flex;justify-content: center;align-items: center;font-size: 20px;
 border-radius: 100px;color: #1c1918;font-weight: 900;font-family: "Roboto", sans-serif;font-optical-sizing: auto;font-style: normal;font-size: 1.5rem;color: #000;font-style: italic;}

#qalist a {color: #000;text-decoration: underline;}
.accordion_content p {font-size: 0.9rem;  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;}

/* 留意事項 */

.note {padding: 4% 2% 8%;background-color: #3c86da;color: #9acaff;}
.note .inner { max-width: 1300px; width: 100%; display: block; padding: 0;font-weight: 400;}
.note p { text-align: center; font-size: 0.85rem;color: #fff;}
.note ul {}
.note li { font-size: 0.75rem; display: block; line-height: 1; }
small {
    font-size: 0.78rem;
    color: #fff;
    margin-top: 2%;
    display: block;
    line-height: 1.8;
}
.copy {display: block;text-align: center;padding-top: 4%;font-size: 0.75rem;}

/*見出し装飾*/

.service , .media , .usage , .example{position: relative;background-color: transparent;}
.service::after , .media::after , .usage::after ,  .example::after{
content: "FEATURES";font-size: 5.75em;font-weight: normal;color: #e2f0ff;position: absolute;
top: -136px;left: 0%;z-index: -1;font-weight: 900;font-family: "Roboto", sans-serif;
font-optical-sizing: auto;background: linear-gradient(90deg, #e5f1ff, #f7fbff);
-webkit-background-clip: text;-webkit-text-fill-color: transparent;
}

.media::after {
background: linear-gradient(90deg, #71b3ff, #3c86da);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.service::after{content: "VALUE";left: -14%;}
.media::after{content: "MEDIA";left: -14%;}
.usage::after{content: "FLOW";left: -14%;}
.example::after{content: "CASE";left: -14%;}

.service::after,
.usage::after,
.example::after {

background: linear-gradient(270deg, #e5f1ff, #c8e7ff, #f7fbff, #e5f1ff);
background-size: 600% 600%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation:
gradientShift 15s ease infinite,
swaySide 15s ease-in-out infinite,
blurWiggle 4s ease-in-out infinite;

}

.media::after
{
background: linear-gradient(270deg, #3692f9, #60bbff, #42a1ff, #3c86da);
background-size: 600% 600%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation:
gradientShift 15s ease infinite,
swaySide 15s ease-in-out infinite,
blurWiggle 2s ease-in-out infinite;

}

@keyframes gradientShift {
0% {background-position: 0% 50%;}
50% {background-position: 100% 50%;}
100% {background-position: 0% 50%;}
}

@keyframes swaySide {
0%, 100% {transform: translate(0px, 0px);}
25% {transform: translate(20px, 18px);}
50% {transform: translate(10px, 0px);}
75% {transform: translate(-10px, -12px);}
}

@keyframes blurWiggle {
0%, 100% { filter: blur(3px); }
50%      { filter: blur(7px); }
}


/*背景色チェンジ*/

#offer {position: relative;background-color: #fff;transition: background-color 0.75s ease;z-index: 0;}
#offer.black-bg {background-color: #3c86da;}

/*併せて要素形態変化*/

.media , .offer{transition: .85s;}
.black-bg .media , .black-bg .offer , .black-bg .view {color: #fff;}

/*時間差で出現*/

/* 初期状態：透明・下にずれてる */
.td-anime {opacity: 0;transform: translateY(40px);transition: opacity 0.8s ease, transform 0.8s ease;}

/* 表示時にアニメーション */
.td-anime.show {opacity: 1;transform: translateY(0);}

/* 遅延を制御する用 */
.td-anime:nth-child(1) { transition-delay: 0.1s; }
.td-anime:nth-child(2) { transition-delay: 0.4s; }
.td-anime:nth-child(3) { transition-delay: 0.7s; }


/*見出しカスタムアニメーション*/

.hidden-before-animate {opacity:0;}
.text_04 {letter-spacing:2px;text-align:center;position:relative;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;margin:0;opacity:1;transition:.5s;}


/*topに戻る*/

.back-to-top {position:fixed;bottom:30px;right:-60px;width:45px;height:45px;color:#fff;text-align:center;line-height:45px;
 font-size:18px;border-radius:50%;box-shadow:0 4px 6px rgba(0,0,0,0.3);z-index:500;transition:right 0.3s ease,opacity 0.3s ease;opacity:0;text-decoration:none;}
.back-to-top.show {right:20px;opacity:1;}


/*STEP*/

.step{font-size: 1.2em;margin-top: 30px;}
.step::before{content: ""; position: absolute; left: 0; top: 0; font-size: 0.9em; font-weight: 900; background: #3c86da; color: #fff; border-radius: 2px; padding: 0.3em 0.8em; line-height: 1; font-weight: 600; font-family: "Roboto", sans-serif; font-optical-sizing: auto;}


/* STEP番号別に中身出し分け〜 */

.step1::before{content: "STEP 1";}
.step2::before{content: "STEP 2";}
.step3::before{content: "STEP 3";}


/*背景ズーム*/

@keyframes kenBurns{0%{transform: scale(1.15) translateY(0);} 100%{transform: scale(1) translateY(-2%);}}

/*　スクロール誘導*/

.scroll_down{position: absolute; width: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; bottom: -4%; z-index: 9999; pointer-events: none;}
.scroll_down span{display: inline-block; position: absolute; right: 0; bottom: 0; left: 0; z-index: 10000; width: 13px; padding: 7px 7px 63px; color: #fff; font-size: 9px; font-family: 'Josefin Sans', sans-serif; line-height: 1; letter-spacing: .2em; text-transform: uppercase; text-decoration: none; writing-mode: vertical-lr; transition: .2s; overflow: hidden; margin: auto;}
.scroll_down span::before, .scroll_down span::after{content: ''; position: absolute; bottom: 0; left: 50%; width: 1px; height: 100px; z-index: 10000;}
.scroll_down span::before{background: #ddd;}
.scroll_down span::after{background: #2072d2; animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;}
#type01 span:after{animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;}
@keyframes sdl01{0%{transform: scale(1, 0); transform-origin: 0 0;} 50%{transform: scale(1, 1); transform-origin: 0 0;} 50.1%{transform: scale(1, 1); transform-origin: 0 100%;} 100%{transform: scale(1, 0); transform-origin: 0 100%;}}


/* ティーリアム */

#__tealiumGDPRecModal {z-index:600!important;}
.privacy_prompt.explicit_consent {display:flex!important;padding:25px 15vw 35px!important;box-sizing:border-box!important;}
.privacy_prompt_content p {font-size:0.75rem!important;margin:0!important;}
.privacy_prompt_content {padding:0 33px 0 0!important;width:80%!important;}
.privacy_prompt_footer {width:20%!important;padding:0px 0px!important;margin:0 auto!important;display:block!important;text-align:center!important;}
.privacy_prompt .button.right {float:unset!important;}
.privacy_prompt_footer .button {font-size:0.8rem!important;padding:11px 15px!important;min-width:50px!important;text-align:center!important;border-radius:4px!important;background-color:#444444!important;box-shadow:unset!important;text-shadow:unset!important;color:#ffffff!important;cursor:pointer!important;font-weight:400;}
.privacy_prompt {max-width:100%!important;}



/* 共通フッターのcssを上書き */

@media print, screen and (min-width: 768px) {
  .list-wrap {max-width:1180px; padding:6rem 1.5rem 4rem; margin:0 auto 0 auto;}
  .list-top {font-size:1.2rem;}
  .list-title {font-size:0.9rem;}
  .list-item-link {font-size:0.9rem; line-height:1; font-weight:400;}
  .footer-top-wrap ul li a {position:relative; font-size:1.1rem; margin-right:3rem; font-weight:400;}
  .footer-top-wrap ul li a::before {top:0rem; left:-2.5rem; width:0.7rem; height:0.7rem;}
  .footer-bottom-text {font-size:1rem; line-height:1.56; color:#333; margin-right:2rem; font-weight:400;}
  .footer .copy-top ul li a {font-size:0.8rem; font-weight:500;}
  .footer .copy-wrap {max-width:1220px;}
  .footer .copy-bottom-text {font-size:0.8rem; font-weight:500;}
}
.link-item::before {margin-right:1.3rem; width:0.6rem; height:0.6rem; border:0; top:0.2rem; left:-2.2rem;}
.link-item {position:relative; line-height:1; font-size:1rem; font-weight:600;}

@media print, screen and (min-width: 300px) and (max-width: 767px) {

.footer-bottom-text {font-size:0.8rem;}
.footer-top-wrap ul li {font-size:0.8rem; width:45%;}
.footer-top-wrap ul {padding:1.5rem 2.5rem 0.5rem;}
.footer-top-wrap ul li::before {content:''; position:absolute; top:-9px; left:-1.5rem; bottom:0; margin:auto; width:0.5rem; height:0.5rem; border:0; border-top:solid 2px #014694; border-right:solid 2px #014694; -webkit-transform:rotate(45deg); transform:rotate(45deg);}
.footer .copy-top ul li a {font-size:0.7rem; font-weight:500;}
.footer .copy-bottom-text {font-size:0.7rem; color:#fff; line-height:normal; font-weight:500;}
.footer .copy-top ul li:first-child {border-left:0;}
.footer .copy-top ul li a {padding-right:0.7rem;}
.footer .copy-top ul li {padding-left:0.8rem;}
}


/* ここからSP　スタイル -////////////////////////////////////////////////////////////////////////////////////////////////////////*/


@media screen and (max-width: 960px) {

/*    共通*/
body{overflow-x: hidden;}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.4;
}

/*ハンバーガーメニュー*/
.hamburger { width: 26px; height: 17px; position: relative; display: flex; justify-content: center; align-items: center; background: none; border: none; cursor: pointer; z-index: 1001; }
.hamburger span { position: absolute; width: 100%; height: 2px; background-color: #3c86da; border-radius: 2px; transition: all 0.3s ease; }
.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 8px; }
.hamburger span:nth-child(3) { top: 16px; }
.hamburger.active span:nth-child(1) { top: 10px; transform: rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { top: 10px; transform: rotate(-45deg); }
.hamburger.active span{background-color: #ffffff;}

/* 全画面メニュー */

.menu{position:fixed;top:0;left:0;width:100%;background:rgb(92 158 227 / 91%);z-index:1000;opacity:0;pointer-events:none;transition:opacity 0.3s ease;height:calc(100vh + 33px);} 
.menu.open{opacity:1;pointer-events:auto;} 
.menu ul{list-style:none;padding:0;margin:25% 0 0 0;text-align:center;position:relative;} 
.menu li{margin:16px 0;display:block;} 
.menu li a{font-size:1.25rem;text-decoration:none;color:#fff;font-weight:600;}


/*ヘッダー*/
.item-center{justify-content:flex-end;} 
.cta_dl,.cta_requ{font-size:0.9rem;width:90%;padding:3.5%;} 
.cta_dl{margin-bottom:7%;} 
.cta_requ::before{top:-28px;left:50%;width:181px;height:48px;} 
.cta_dl::before{width:227px;height:43px;} 
.cta_box{gap:14px;justify-content:space-around;margin-top: 18%;} 
.cta_dl::after{width:10px;height:10px;} 
.cta_requ::after{width:10px;height:10px;} 
h2{font-size:clamp(1.5rem,10.3vw,3.3rem);} 
.power{font-size:0.75rem;color:#000;margin-bottom:0%;} 
#fv{overflow:hidden;background-image:unset;padding-bottom:11%;} 
.power span{display:block;} 
.fv-inner{padding:4vh 0% 0;} 
header img{width:88%;} 
.inner{padding:6px 13px 0px 0px;} 
.item-left{width:25%;padding-left:7px;} 
.item-right{width:25%;margin-left:9px;} 
.item-center{width:50%;} 
.h-active{transform:translateY(-33px);} 
.g-active img{width:88%;} 
.heading p{font-size:clamp(0.6rem,3vw,1.1rem);padding-right:0;padding-bottom:0;margin-top:8%;font-weight:400;}

/*philosophy*/
.des span{display:inline;} 
.philosophy p{font-size:1.5rem;padding:0 10%;} 
.des{font-size:.8rem!important;} 
.philosophy .inner{padding:0;overflow:unset;top:49%;} 
.philosophy img{width: 100vh;height: 40vh;} 
h3{font-size:1.6rem;} 
.service::after,.media::after,.usage::after,.example::after{font-size:4.75em;top:-54px;} 
#feature{padding:19% 2% 10%;} 
.feature{display:flex;flex-wrap:wrap;} 
.feature .item{width:100%;padding:7px;margin-bottom:13%;} 
#feature p{min-height:0;} 
.feature span{font-size:0.70rem;margin-top:16px;display:block;font-weight:400;} 
h4{text-align:center;font-size:1.2rem;min-height:auto;margin-bottom:5%;}

/*    cta*/
#cta .inner{padding:10px 0;} 
#cta{padding:11% 0 7%;} 
#case p{font-size:1rem;} 
#case{padding:30% 0% 23%;} 
.case{display:flex;padding-top:14%;flex-wrap:wrap;} 
.case .item{width:100%;padding:5% 10% 10%;box-sizing:border-box;min-height:370px;} 
.case img{padding:4% 0%;} 
.kai{line-height:1.5;display:block!important;position:unset!important;font-weight:600;text-align:center!important;color:#3c86da!important;font-size:1rem!important;margin:0!important;} 
.subcopy span{bottom:-27px;}

/*   offer flow*/
.offer{display:flex;flex-wrap:wrap;} 
#offer{padding:32% 2% 16%;} 
.offer .item{width:100%;padding:10px 10px;margin-bottom: 10%;} 
.offer span{margin-top:0%;        margin-top: 5%;} 
#flow{padding:30% 2% 5%;} 
.flow{display:flex;flex-wrap:wrap;} 
.flow .item{width:100%;padding:8px;margin-bottom:10%;} 
#qalist{background-color:#f6f6f6;margin-top:10%;padding:20% 7px 7%;} 
.accordion_header{font-size:0.85rem;line-height: 1.4;} 
.accordion_content p{font-size:0.75rem;} 
.note p{font-size:0.75rem;} 
small{font-size:0.65rem;color:#fff;font-weight:400;} 
.note .inner{padding:0 2% 3%;box-sizing:border-box;}

/*   アニメーション*/
.td-anime{opacity:0;transform:translateY(20px);transition:all 0.5s ease;}.td-anime.show{opacity:1;transform:translateY(0);}.td-anime:nth-child(1){transition-delay:0s;}.td-anime:nth-child(2){transition-delay:0s;}.td-anime:nth-child(3){transition-delay:0s;}

/*  swiper*/
.swiper-wrapper {padding:0 0 5%;}
.swiper {position:relative;padding-bottom:25px!important;}
.swiper-pagination {position:absolute;bottom:10px;left:0;width:100%;text-align:center;}
.swiper-pagination-bullet-active {background:#3c86da;}

/*　ティーリアム  */
.privacy_prompt_content p {font-size:0.6rem!important;margin:0!important;text-align:justify;margin-bottom:3%!important;}
.privacy_prompt.explicit_consent {display:block!important;padding:16px 12px 13px!important;box-sizing:border-box!important;}
.privacy_prompt_content {padding:0 11px 0 0!important;width:100%!important;}

/* side cta */
.privacy_prompt_footer {width:100%!important;}
#side_cta #cta {border-top:1px solid #8cbdf1;background-color:transparent;padding:13% 0 0 0;border-radius:1px;width:92%;margin:0 auto;}
#side_cta .cta_dl {width:90%!important;padding:4.5%!important;font-size:0.9rem;margin-bottom:0%;}
#side_cta .cta_dl::before {width:235px;height:33px;}
#side_cta .cta_requ::before {top:-28px;left:50%;width:192px;height:49px;}
#side_cta .cta_requ {margin-top:30px;width:90%;box-sizing:border-box;padding:4.5%;font-size:0.9rem;}
#side_cta a {font-size:0.9rem;}
.fv-container {width:100%;}
.fv-inner .item {width:100%;padding: 0 4%;}

/* main v */
.sp_main_c {margin-bottom:-37vw;}
.sp_main_c img {width:100vw;padding:0;margin:0;position:relative;top:-17vw;z-index:-1;right: -5vw;}

/*パンくず*/
.subcopy span{font-size: 0.7rem; position: absolute; right: 8px; bottom: -19px; color: #000;}
.breadcrumbs{color: #000000; font-size: 0.65rem!important; padding: 6px 10px 13px 10px; font-weight: 500; background-color: #efefef; transition: .4s;font-weight: 400;}
.breadcrumbs a{color: #000000; text-decoration: underline;}

/* その他 */
.back-to-top {z-index: 1;}
.heading p {margin-top: 8%;line-height: 1.95;}
.label img {margin-top: 0%;}
#flow p { display: block;min-height: 0px;margin-bottom: 5%;}

/*追加*/
    
.sp .item-center li::after {content: none !important; }
@media print, screen and (min-width: 300px) and (max-width: 767px) {
.footer-bottom-text {font-size: 0.8rem;font-weight: 400;} 
.footer-bottom-img {margin-top: 1rem;display: flex;justify-content: center;}
.footer-bottom-img img {width: 2rem;height: 2rem;}
}