@charset "UTF-8";

* {margin:0 0; padding:0 0; box-sizing:border-box;}
html, body {max-width:3840px; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo,"ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

section {letter-spacing:0.5px;}
ul {list-style:none;}
a {display:inline-block; text-decoration:none !important; transition:all 0.3s ease-in-out;}
a:hover {text-decoration:none !important;}
h1 {margin:0 auto; padding:0 0; font-size:68px; line-height:1.5; color:#222; letter-spacing:0.5px; text-align:center; font-weight:600;}
h2 {margin:0 auto; padding:0 0; font-size:38px; line-height:1.6; color:#222; letter-spacing:0.5px; text-align:center; font-weight:600;}
h3 {margin:0 auto; padding:0 0; font-size:20px; line-height:1.6; color:#222; letter-spacing:0.5px; text-align:center; font-weight:400;}
p {margin:0 auto; padding:0 0; font-size:14px; line-height:1.8; color:#222; letter-spacing:0.5px; text-align:center; font-weight:400;}
span {display:inline-block;}
img {width:auto; height:auto; max-width:100%; max-height:100%;}

@font-face {
  font-family: 'icomoon';
  src: url("/fonts/icomoon.eot?4hmkpr");
  src: url("/fonts/icomoon.eot?4hmkpr#iefix") format("embedded-opentype"), url("/fonts/icomoon.ttf?4hmkpr") format("truetype"), url("/fonts/icomoon.woff?4hmkpr") format("woff"), url("/fonts/icomoon.svg?4hmkpr#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}

@media only screen and (max-width: 768px) {
h1 {font-size:40px;}
h2 {font-size:24px;}
h3 {font-size:18px;}
p {font-size:12px;}
}

@media only screen and (max-width: 420px) {
h1 {font-size:26px; line-height:1.4;}
h2 {font-size:16px; margin:0 auto 10px auto;}
h3 {font-size:14px;}
p {font-size:12px;}
}

@media only screen and (max-width: 330px) {
p {font-size:11px;}
}


header {position:fixed; left:0; top:0; width:100%; height:80px; background:#FCFDFD; box-shadow:0 2px 6px -2px #C7E4F1; z-index:100;}
header div#hdr-wrap {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:0 20px; margin:0 auto; padding:0 0; width:100%; height:100%; max-width:1240px;}

#logo {margin:0 0; padding:0 0; width:360px; height:50px; line-height:0.5;}
#logo a {width:100%; height:100%; line-height:0.5; transition:all 0.3s ease-in-out;}
#logo a:hover {opacity:0.7;}

#nav_and_cta {display:flex; flex-wrap:wrap; justify-content:end; align-items:center; gap:0 30px;}
ul.cta {display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 10px; z-index:20;}
ul.cta li {margin:0 0; padding:0 0; text-align:center;}
ul.cta li a {display:inline-block; padding:10px 30px; min-width:200px; font-size:16px; line-height:30px; text-align:center; font-weight:600; letter-spacing:1px; color:#fff; background:#ccc; border-radius:50px;}
ul.cta li a:hover {filter:brightness(0.9);}
ul.cta li:nth-of-type(1) a {background:#136DB5;}
ul.cta li:nth-of-type(2) a {background:#FF9301;}
ul.cta li a span {position:relative; padding:0 40px 0 0;}
ul.cta li a span::after {content:""; display:inline-block; position:absolute; right:0; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0%, -50%); -ms-transform:translate(0, -50%);}


@media only screen and (max-width: 768px) {
#hbg {position:absolute; right:10px; top:9px; display:inline-block; width:28px; height:28px; text-indent:28px; white-space:nowrap; overflow:hidden; cursor:pointer; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}

#hbg span,
#hbg span::before,
#hbg span::after {position:absolute; top:50%; left:2px; height:2px; width:24px; background:#bbb; -webkit-transition:all 0.25s; transition:all 0.25s;}

#hbg span::before {content:""; top:-7px; left:0;}
#hbg span::after {content:""; top:7px; left:0;}

#hbg-chk:checked ~ #hbg span {height:0; background:transparent;}
#hbg-chk:checked ~ #hbg span::before {top:0; -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
#hbg-chk:checked ~ #hbg span::after {top:0; -webkit-transform:rotate(45deg); transform:rotate(45deg);}
#hbg-chk:not(:checked) ~ #nav_and_cta {display:none;}
#hbg-chk:checked ~ #nav_and_cta {display:block;}

ul.cta li a {padding:15px 20px;}
}


@media only screen and (max-width: 420px) {
ul.cta {justify-content:space-around; gap:0 10px;}
ul.cta li {flex-basis:calc((100% - 10px) / 2);}
ul.cta li a {width:100%; padding:15px 5px;}
}


@media only screen and (max-width: 330px) {
ul.cta {gap:0 5px;}
ul.cta li {flex-basis:auto;}
ul.cta li a {padding:15px 10px; font-size:14px;}
}


@media only screen and (min-width: 769px) {
div#page-top {display:block; position:fixed; right:40px; bottom:60px; margin-top:0; z-index:1100;}
div#page-top > a {overflow:hidden; display:block; width:62px; height:62px; transition:all 0.3s ease 0s; background:url(../img/up_btn.png) no-repeat 0 50%;}
div#page-top > a span {display:none;}
}


@media only screen and (max-width: 768px) {
header {height:50px; padding:0 20px;}
header .logo .inner a img {max-height:25px;}
header ul {gap:0 10px; right:10px; top:0; height:50px;}
header ul li a {padding:8px 15px; font-size:14px; border-radius:8px;}
#page-top {background:#f3f3f3;}
#page-top a {display:block; position:relative; font-size:14px; text-align:center; padding:10px 0; color:#15619d;}
#page-top a span::before {font-family:'icomoon' !important; font-style:normal; font-weight:normal; font-variant:normal; text-transform:none; line-height:1; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; content:"\e903"; display:inline-block; margin-right:10px;}
}


@media only screen and (max-width: 420px) {
header {padding:0 10px;}
header div#hdr-wrap {gap:0 20px;}
}

@media only screen and (max-width: 330px) {
header div#hdr-wrap {gap:0 10px;}
}


a.modBtn:hover {filter:brightness(0.9);}
a.modBtn span {position:relative; padding:0 45px 0 0;}
a.modBtn span::after {content:""; display:block; position:absolute; right:0; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0%, -50%); -ms-transform:translate(0, -50%); width:30px; height:30px; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; background:url(https://www.e-sales.jp/wp-content/themes/esm/assets/img/common/icon_arrow.svg) no-repeat 50% 50% / contain;}
a.modBtn.modBtn--download span::after {background:url(https://www.e-sales.jp/wp-content/themes/esm/assets/img/common/icon_download_navy.svg) no-repeat 50% 50% / contain;}
a.modBtn:hover span::after {transform:translate(6px, -50%); -webkit-transform:translate(6px, -50%); -ms-transform:translate(6px, -50%);}


#esm_lineup {}
#esm_lineup div {}
#esm_lineup div > h2 {background:#E4F4F5;}
#esm_lineup div > p {}


section#sc_mv {position:relative; width:100%; margin:80px auto 0 auto; padding:50px 0 60px 0 !important; background:url(../img/mv_bg.webp) no-repeat left 50% top 50% / cover, linear-gradient(90deg, #F5F5F5, #d8f4ff); background-blend-mode:multiply; overflow:hidden;}
section#sc_mvzzz::after {content:""; display:block; position:absolute; right:50px; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0, -50%); -ms-transform:translate(0, -50%); padding-top:calc(94.8% * 0.40); width:40%; height:0; background:url(../img/mv.webp) no-repeat left 50% top 50% / contain;}

section#sc_mv > div#mv_box {position:relative; margin:0 auto; padding:0 0; text-align:center; max-width:1240px; background:url(../img/mv.webp) no-repeat right 0 top 50% / contain;}
section#sc_mv > div#mv_box > div {position:relative; margin:0 0 0 50px; padding:0 45% 0 0; text-align:left; font-family:'Noto Sans JP', sans-serif;}
section#sc_mv > div#mv_box > div p {position:relative; font-weight:900; color:#131313; text-align:left;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) {margin:0 0 15px 0; padding:0 0; font-size:20px; line-height:1.4;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong {display:inline-block; margin:0 10px 0 0; padding:5px 15px; color:#0F6DB5; background:#fff;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong:nth-of-type(1) {color:#fff; background:#0F6DB5;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong:nth-last-of-type(1) {margin:0 0;}
section#sc_mv > div#mv_box > div p:nth-of-type(2) {margin:0 0; padding:0 0; font-size:40px; line-height:1.4; font-weight:900; color:#1C4476;}
section#sc_mv > div#mv_box > div p:nth-of-type(3) {margin:0 0 25px 0; padding:0 0; font-size:48px; line-height:1.4; font-weight:900; color:#1C4476;}
section#sc_mv > div#mv_box > div h1 {position:relative; margin:0 0; padding:0 0; height:98px;}
section#sc_mv > div#mv_box > div h1::before {content:""; display:block; position:absolute; left:0; top:0; width:100%; height:98px; background:url(../img/logo.svg) no-repeat 0 50% / contain;}
section#sc_mv > div#mv_box > div h1 span {position:absolute; right:90px; bottom:10px; font-size:0; opacity:0;}

section#sc_mv > div#mv_box > div > ul {position:relative; display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:end; gap:20px 20px; margin:40px 0 0 0; padding:10px 20px 15px 20px; background:rgba(255,255,255,0.7); border-radius:20px;}
section#sc_mv > div#mv_box > div > ul li {margin:0 0; padding:0 0;}
section#sc_mv > div#mv_box > div > ul li > span {position:relative; display:block; font-size:14px; line-height:1.5;}
section#sc_mv > div#mv_box > div > ul li a {display:inline-block; margin:0 0; padding:15px 20px; min-width:280px; font-size:18px; line-height:30px; color:#fff; letter-spacing:1px; font-weight:600; text-align:center; text-decoration:none; background:linear-gradient(90deg, #F4ED54, #136DB5); border-radius:50px; transition:all 0.3s ease-in-out;}
section#sc_mv > div#mv_box > div > ul li:nth-of-type(1) a {background:#136DB5;}
section#sc_mv > div#mv_box > div > ul li:nth-of-type(2) a {background:#FF9301;}
section#sc_mv > div#mv_box > div > ul li a:hover {filter:brightness(0.9);}
section#sc_mv > div#mv_box > div > ul li a span {position:relative; padding:0 40px 0 0;}
section#sc_mv > div#mv_box > div > ul li a span::after {content:""; display:inline-block; position:absolute; right:0; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0%, -50%); -ms-transform:translate(0, -50%);}
section#sc_mv > div#mv_box > div > ul li a:hover span::after {transform:translate(6px, -50%); -webkit-transform:translate(6px, -50%); -ms-transform:translate(6px, -50%);}


section[id^="sc_0"] {position:relative; z-index:10; margin:0 auto !important; padding:0 0;}
section[id^="sc_"] > div {margin:0 auto; padding:100px 0 100px 0; text-align:center; max-width:1240px;}
section[id^="sc_"] > div > h2 {position:relative; display:inline-block; margin:0 auto 20px auto; padding:0 0; font-size:34px !important; line-height:1.4; color:#222;}
section[id^="sc_"] > div > h2::after {content:""; display:block; margin:15px auto 0 auto; width:50px; height:6px; background:#319FDB; border-radius:10px;}
section[id^="sc_"] > div > h2 span.sub_txt {font-size:70%;}
section[id^="sc_"] > div > h2 strong {color:#027BCF;}
section[id^="sc_"] > div > h2 + p {margin:25px auto 0 auto; font-size:16px; line-height:1.6 !important; font-weight:600; max-width:1000px;}


.sc_cta {background:url(../img/mv_bg.webp) no-repeat left 50% top 50% / cover;}
.sc_cta > div {margin:0 auto; padding:75px 0; text-align:center; max-width:900px;}
.sc_cta > div ul.cta_btn {position:relative; display:inline-flex; flex-wrap:wrap; align-items:end; gap:20px 20px; margin:0 0; padding:15px 20px 20px 28.5%; background:rgba(255,255,255,0.7); border-radius:20px;}
.sc_cta > div ul.cta_btn::before {content:""; display:block; position:absolute; left:20px; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0, -50%); -ms-transform:translate(0, -50%); width:28.5%; height:0; padding-top:calc(94.8% * 0.285); background:url(../img/mv.webp) no-repeat left 0 top 50% / contain;}
.sc_cta > div ul.cta_btn li {display:inline-block; margin:0 0; padding:0 0;}
.sc_cta > div ul.cta_btn li a {display:inline-block; padding:15px 30px; font-size:18px; line-height:1.6; text-align:center; font-weight:600; letter-spacing:1px; color:#fff; background:linear-gradient(90deg, #F4ED54, #136DB5); border-radius:50px;}
.sc_cta > div ul.cta_btn li:nth-of-type(1) a {background:#136DB5;}
.sc_cta > div ul.cta_btn li:nth-of-type(2) a {background:#FF9301;}
.sc_cta > div ul.cta_btn li a:hover {filter:brightness(0.9);}
.sc_cta > div ul.cta_btn li a span {display:inline-block;}
.sc_cta > div ul.cta_btn li a span:nth-last-of-type(1) {position:relative; padding:0 40px 0 0;}
.sc_cta > div ul.cta_btn li a span:nth-last-of-type(1)::after {content:""; display:inline-block; position:absolute; right:0; top:50%; transform:translate(0, -50%); -webkit-transform:translate(0%, -50%); -ms-transform:translate(0, -50%);}
.sc_cta > div ul.cta_btn li a:hover span:nth-last-of-type(1)::after {transform:translate(6px, -50%); -webkit-transform:translate(6px, -50%); -ms-transform:translate(6px, -50%);}


#sc_02 + .sc_cta {background:linear-gradient(90deg, #319FDB, #2C95CE);}
#sc_02 + .sc_cta > div {padding:40px 0 100px 0;}


#sc_01 {background:#fff;}
#sc_01 > div > div {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px 20px; margin:40px auto 0 auto; max-width:1100px}
#sc_01 > div > div > dl {position:relative; width:calc((100% - 110px) / 2); margin:0 0; padding:0 0; border-radius:20px;}
#sc_01 > div > div > dl:nth-of-type(1) {background:linear-gradient(#fff 30px, #FA706F 30px);}
#sc_01 > div > div > dl:nth-of-type(2) {background:linear-gradient(#fff 30px, #319EDA 30px);}
#sc_01 > div > div > dl::before {content:""; display:block; margin:0 auto; width:100%; height:0; padding-top:48%; border-radius:20px 20px 0 0;}
#sc_01 > div > div > dl:nth-of-type(1)::before {background:#fff url(../img/sc_01_01a.webp) no-repeat left 50% top 50% / contain;}
#sc_01 > div > div > dl:nth-of-type(2)::before {background:#fff url(../img/sc_01_01b.webp) no-repeat left 50% top 50% / contain;}
#sc_01 > div > div > dl::after {content:""; display:block; position:absolute; right:-85px; top:calc(50% - 30px); width:60px; height:60px; background:#2E9AD4; clip-path:polygon(0 25%, 50% 25%, 50% 0, 100% 50%, 50% 100%, 50% 75%, 0 75%);}
#sc_01 > div > div > dl:nth-last-of-type(1)::after {content:none;}
#sc_01 > div > div > dl dt {padding:20px 5px 0 5px; font-size:24px; line-height:1.5; font-weight:600; color:#fff;}
#sc_01 > div > div > dl dd {padding:5px 5px 20px 5px; font-size:16px; line-height:1.7; font-weight:600; color:#fff;}
#sc_01 > div > div > dl dd ul {display:inline-block; margin:0 auto; text-align:left; list-style:disc;}
#sc_01 > div > div > dl dd ul li {margin:0 0 0 1em;}


#sc_02 {background:#E4F4F5;}
#sc_02 > div {}
#sc_02 > div p:nth-of-type(1) {font-size:20px;}
#sc_02 > div p:nth-of-type(1) strong {display:inline-block; margin:0 10px 0 0; padding:5px 15px; color:#0F6DB5; background:#fff;}
#sc_02 > div p:nth-of-type(1) strong:nth-of-type(1) {color:#fff; background:#0F6DB5;}
#sc_02 > div > h2 {position:relative; display:block; margin:25px auto 0 auto; padding:0 0; height:92px;}
#sc_02 > div > h2::before {content:""; display:block; position:absolute; left:0; top:0; width:100%; height:92px; background:url(../img/logo.svg) no-repeat 50% 50% / contain;}
#sc_02 > div > h2::after {content:none;}
#sc_02 > div > h2 span {position:absolute; right:90px; bottom:10px; font-size:0; opacity:0;}
#sc_02 > div > h2 + p {margin:40px auto 0 auto; font-size:32px;}
#sc_02 > div > h2 + p + p {margin:20px auto 0 auto; font-size:16px; font-weight:600; max-width:800px;}
#sc_02 > div > div {margin:0 auto; padding:100px 0 0 0;}
#sc_02 > div > div > ul {position:relative; list-style:none; margin:0 auto; max-width:1100px;}
#sc_02 > div > div > ul > li {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px 25px; margin:0 auto 80px auto; padding:0 0;}
#sc_02 > div > div > ul > li:nth-last-of-type(1) {margin-bottom:0;}
#sc_02 > div > div > ul > li:nth-of-type(1)::before {content:""; display:block; width:38%; height:0; padding-top:calc(66.7% * 0.38); background:url(../img/sc_02_01.webp) no-repeat left 50% top 50% / contain;}
#sc_02 > div > div > ul > li:nth-of-type(2)::after {content:""; display:block; width:38%; height:0; padding-top:calc(66.7% * 0.38); background:url(../img/sc_02_02.webp) no-repeat left 50% top 50% / contain;}
#sc_02 > div > div > ul > li > dl {width:calc(100% - 38% - 25px); text-align:left;}
#sc_02 > div > div > ul > li > dl > dt {position:relative; display:flex; flex-direction:column; flex-wrap:wrap; justify-content:center; margin:0 0 20px 0; padding:0 0 0 160px; min-height:106px; font-size:30px; font-weight:600;}
#sc_02 > div > div > ul > li > dl > dt:nth-of-type(1) {color:#6B6BE9;}
#sc_02 > div > div > ul > li > dl > dt:nth-of-type(2) {color:#F45D8A;}
#sc_02 > div > div > ul > li > dl > dt::before {content:""; display:block; position:absolute; left:0; top:0; width:141px; height:106px; background:url(../img/sc_02_icon_01.png) no-repeat left 0 top 50% / contain;}
#sc_02 > div > div > ul > li:nth-of-type(2) > dl > dt {color:#F45D8A;}
#sc_02 > div > div > ul > li:nth-of-type(2) > dl > dt::before {background:url(../img/sc_02_icon_02.png) no-repeat left 0 top 50% / contain;}
#sc_02 > div > div > ul > li > dl > dd {margin:0 0 20px 0;}
#sc_02 > div > div > ul > li > dl > dd a {display:inline-block; padding:10px 30px; min-width:200px; font-size:16px; line-height:30px; text-align:center; font-weight:600; letter-spacing:1px; color:#fff; background:#136DB5; border-radius:50px;}


#sc_03 {background:#fff;}
#sc_03 > div > h2 + p strong {color:#319FDB;}
#sc_03 > div > div {position:relative; margin:40px auto 0 auto;}
#sc_03 > div > div ul {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px 40px; margin:0 auto; list-style:none; max-width:1100px;}
#sc_03 > div > div ul li {position:relative; width:calc((100% - 80px) / 3); margin:0 0; padding:90px 0 0 0; font-size:26px; font-weight:600; background:linear-gradient(#0277c3 10px, #fff 10px, #fff 80px, #fff 90px, #0277c3 90px); border:10px solid #0277C3; border-radius:20px;}
#sc_03 > div > div ul li::before {content:""; display:block; position:absolute; left:0; top:0; width:90px; height:90px; background:#0277C3; border-radius:0 0 10px 0;}
#sc_03 > div > div ul li:nth-of-type(1)::before {background:#0277C3 url(../img/sc_03_icon_01.png) no-repeat left 50% top 50% / 75% 75%;}
#sc_03 > div > div ul li:nth-of-type(2)::before {background:#0277C3 url(../img/sc_03_icon_02.png) no-repeat left 50% top 50% / 75% 75%;}
#sc_03 > div > div ul li:nth-of-type(3)::before {background:#0277C3 url(../img/sc_03_icon_03.png) no-repeat left 50% top 50% / 75% 75%;}
#sc_03 > div > div ul li::after {content:""; display:block; position:absolute; right:-40px; top:calc(50% - 15px); width:20px; height:30px; background:url(../img/icon_04_g.png) no-repeat left 50% top 50% / contain;}
#sc_03 > div > div ul li:nth-last-of-type(1)::after {content:none;}
#sc_03 > div > div ul li span {display:flex; justify-content:center; align-items:center; position:absolute; left:90px; top:0; width:calc(100% - 90px); height:90px; background:#fff; border-radius:10px 10px 0 0;}
#sc_03 > div > div ul li figure {display:block; margin:0 auto; padding:0 10px; line-height:0.5; background:#fff; border-radius:10px 0 10px 10px;}
#sc_03 > div > div ul li figure img {width:auto; height:auto; max-width:100%; max-height:100%;}
#sc_03 > div > p.cta_btn {margin:40px auto 0 auto;}
#sc_03 > div > p.cta_btn > span {display:block; margin:0 auto 5px auto; font-size:14px; line-height:1.5; text-align:center;}
#sc_03 > div > p.cta_btn a {display:inline-block; padding:10px 30px; min-width:200px; font-size:16px; line-height:30px; text-align:center; font-weight:600; letter-spacing:1px; color:#fff; background:#136DB5; border-radius:50px;}

#sc_04 {background:#f4f4f4;}
#sc_04 > div > div {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px 30px; margin:65px auto 0 auto; max-width:740px;}
#sc_04 > div > div > dl {display:flex; flex-direction:column; width:calc((100% - 30px) / 2); background:#fff; border-radius:30px; overflow:hidden;}
#sc_04 > div > div > dl dt {padding:15px 10px; font-size:26px; line-height:1.6; font-weight:600; color:#fff; background:#0F6DB5;}
#sc_04 > div > div > dl dt span:nth-of-type(2) {font-size:80%;}
#sc_04 > div > div > dl dd {display:flex; justify-content:center; align-items:center; height:100%; padding:50px 10px; font-size:20px; font-weight:600; color:#222;}
#sc_04 > div > div > dl dd div span:nth-of-type(1) {font-size:260%;}
#sc_04 > div > div > p {padding:0 0; font-size:12px;}


#sc_06 {background:#0F6DB5;}
#sc_06 > div > h2 {color:#fff;}
#sc_06 > div > h2::after {background:#8DD7FF;}
#sc_06 > div > h2 + p {color:#fff; max-width:800px;}
#sc_06 > div > div {margin:40px auto 0 auto; padding:0 0;}
#sc_06 > div > div > ul#app_example_list {position:relative; display:flex; flex-wrap:wrap; justify-content:center; gap:30px 30px; margin:0 auto; padding:0 0; max-width:1100px; list-style:none;}
#sc_06 > div > div > ul#app_example_list > li {position:relative; display:inline-flex; flex-direction:column; gap:20px 0; width:calc((100% - 60px) / 3); margin:0 0; padding:0 0; background:#fff; border-radius:20px; transition:all 0.3s ease-in-out; cursor:pointer; overflow:hidden;}
#sc_06 > div > div > ul#app_example_list > li:hover {filter:brightness(0.9);}
#sc_06 > div > div > ul#app_example_list > li::before {order:2; content:""; display:inline-block; margin:0 auto; width:90%; height:0; padding-top:50%;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(1)::before {background:url(../img/sc_06_icon_01.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(2)::before {background:url(../img/sc_06_icon_02.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(3)::before {background:url(../img/sc_06_icon_03.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(4)::before {background:url(../img/sc_06_icon_04.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(5)::before {background:url(../img/sc_06_icon_05.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(6)::before {background:url(../img/sc_06_icon_06.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(7)::before {background:url(../img/sc_06_icon_07.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(8)::before {background:url(../img/sc_06_icon_08.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(9)::before {background:url(../img/sc_06_icon_09.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li:nth-of-type(10)::before {background:url(../img/sc_06_icon_10.png) no-repeat 50% 50% / contain;}
#sc_06 > div > div > ul#app_example_list > li::after {order:3;content:""; display:inline-block; margin:0 auto 20px auto; width:260px; height:40px; background:url(../img/sc_06_btn.png) no-repeat 50% 50% / contain; border-radius:50px; overflow:hidden;}
#sc_06 > div > div > ul#app_example_list > li div {order:1; display:block; padding:10px 2px; font-size:22px; line-height:1.8; font-weight:600; text-align:center; background:#DEF1FF;}


#sc_06 > div > div > ul#app_example_wrap {display:none; position:fixed; left:0; top:0; width:100%; height:100%; max-width:100%; background:rgba(0,0,0,0.5); cursor:pointer; list-style:none;}
#sc_06 > div > div > ul#app_example_wrap > li {display:none; position:fixed; left:50%; top:25px; width:92%; max-width:1060px; padding:0 0; background:#fff; border-radius:20px; filter:drop-shadow(0px 3px 12px rgba(0, 0, 0, 0.3)); transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); -ms-transform:translate(-50%, 0);}
#sc_06 > div > div > ul#app_example_wrap > li > dl {margin:0 0; padding:20px 15px; background:#fff; border:15px solid #DEF1FF; border-radius:20px; cursor:auto;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt {display:inline-block; width:90%; margin:0 auto 10px auto; padding:0 10px 10px 10px; font-size:28px; line-height:1.6; font-weight:600; color:#0F6DB5; border-bottom:1px solid #666;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt h3 {font-size:34px; line-height:1.6; font-weight:600; color:#0F6DB5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt h3 span.ae_small {font-size:65%;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd {margin:0 0; padding:0 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd h4 {display:inline-block; margin:40px auto 30px auto; padding:0 30px 5px 30px; font-size:24px; line-height:1.6; font-weight:600; text-align:center; border-bottom:1px solid #666;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div {padding:10px 15px; max-height:calc(100vh - 235px); overflow:auto; overflow-y:scroll;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div > * {max-width:920px;}

#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p {display:inline-block; margin:0 auto 20px auto; padding:0 0; font-size:18px; line-height:1.6; text-align:left;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p.ae_catch {font-size:24px; font-weight:600; color:#0F6DB5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p.ae_catch span {display:block;}

#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div figure {margin:20px auto; padding:0 0; line-height:0.5; max-width:770px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div figure img {width:auto; height:auto; max-width:100%; max-height:100%;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div figure.ae_logo img {max-width:400px; max-height:130px;}

#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail {margin:0 auto; padding:0 0; max-width:770px; text-align:left;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dt {position:relative; margin:40px 0 20px 0; padding:0 0 0 24px; font-size:22px; line-height:24px; font-weight:600; color:#0F6DB5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dt:before {content:""; display:block; width:9px; height:24px; position:absolute; top:0; left:0; background:-webkit-gradient(linear, left top, right top, from(#4ba3f8), to(#77bcff)); background:linear-gradient(to right, #4ba3f8 0%, #77bcff 100%); border-radius:9999px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p + dl.ae_detail dt:nth-of-type(1) {margin:20px 0 20px 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd {margin:0 auto 20px auto; padding:0 0; font-size:14px; color:#222;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd:has(img) {line-height:0.5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd > span {font-size:12px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd:nth-last-of-type(1) {margin-bottom:0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list {background:#F4F4F4; border-radius:20px; overflow:hidden;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list > p {width:100%; margin:0 auto; padding:10px 5px; text-align:center; font-size:22px; line-height:1.6; font-weight:600; color:#fff; background:#0F6DB5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list > p span {font-size:14px; font-weight:400;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div {display:flex; flex-wrap:wrap; justify-content:space-between; gap:0 0; margin:20px 20px; padding:20px 20px; background:#fff; border-radius:10px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div ul {margin:0 0; padding:0 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div ul li {position:relative; margin:0 0; padding:0 0 0 13px; font-size:14px; line-height:1.4; color:#222;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div ul li::before {content:""; display:block; position:absolute; left:0; top:calc(50% - 4px); width:8px; height:8px; background:#0F6DB5; border-radius:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div > p {margin:10px auto 0 auto; padding:0 0; text-align:center; font-size:10px; line-height:1.5;}

#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price {display:flex; flex-wrap:wrap; justify-content:center; gap:20px 40px; margin:0 auto;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li {width:calc((100% - 40px) / 2); padding:0 0 30px 0; background:#F4F4F4; border-radius:20px; overflow:hidden;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li h5 {margin:0 auto 15px auto; padding:10px 5px; font-size:26px; line-height:1.5; font-weight:600; text-align:center; color:#fff; background:#0F6DB5;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li h5 span {font-size:60%;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p {margin:0 auto; padding:0 5px; font-size:58px; line-height:1.3; font-weight:600; text-align:center;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p span {margin:0 5px; font-size:20px; font-weight:400;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p span:nth-last-of-type(1) {margin:0 0; font-size:12px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p.ae_memo {display:block; margin:10px auto 5px auto; font-size:14px; font-weight:400;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p.ae_price_btn {display:block; margin:0 auto; padding:0 0; font-size:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p.ae_price_btn a {display:inline-block; padding:10px 30px; font-size:16px; line-height:1.6; text-align:center; font-weight:600; letter-spacing:1px; color:#fff; background:#0F6DB5; border-radius:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p.ae_price_btn a span:nth-last-of-type(1) {position:relative; margin:0 auto; padding:0 40px 0 0; font-size:16px; font-weight:600;}

#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn {margin:10px auto 0 auto; padding:0 0; width:100%;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a {margin:0 0; padding:10px 30px; font-size:18px; line-height:1.6; font-weight:600; color:#222; background:#FFDC49; border-radius:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a:hover {filter:brightness(0.9);}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span {position:relative; margin:0 0; padding:0 35px 0 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span::after {content:""; display:inline-block; position:absolute; right:0; top:50%; transform:translate(0, -60%); -webkit-transform:translate(0%, -60%); -ms-transform:translate(0, -60%); width:28px; height:18px; background:url(../img/icon_02_b.png) no-repeat 50% 50% / contain;}

#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_l {position:absolute; left:-75px; top:calc(50% - 30px); width:60px; height:60px; background:rgba(255,255,255,0.5) url(../img/icon_l.png) no-repeat 50% 50% / contain; border-radius:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_r {position:absolute; right:-75px; top:calc(50% - 30px); width:60px; height:60px; background:rgba(255,255,255,0.5) url(../img/icon_r.png) no-repeat 50% 50% / contain; border-radius:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.ae_close_btn {position:absolute; right:-15px; top:-15px; width:60px; height:60px; background:url(../img/icon_close.png) no-repeat 50% 50% / contain;}

#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_l,
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_r,
#sc_06 > div > div > ul#app_example_wrap > li > div.ae_close_btn {transition:all 0.3s ease-in-out;}

#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_l:hover,
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_r:hover,
#sc_06 > div > div > ul#app_example_wrap > li > div.ae_close_btn:hover {filter:brightness(0.9);}


#footer {position:relative; z-index:10; padding:30px 0; text-align:center; background:#E4F4F5;}
#footer p a {position:relative; margin:0 auto; min-width:250px; font-size:0;}
#footer p a::before {content:""; display:block; margin:0 0; width:100%; height:45px; background:url(../img/logo_sb_b.png) no-repeat 50% 50% / contain;}
#footer p a:hover {opacity:0.7;}
#footer small {display:inline-block; margin:0 auto;}


@media only screen and (max-width: 768px) {

section#hdr {height:50px; padding:0 10px 0 20px !important;}
#logo {height:34px;}
#logo a {height:34px;}

#nav_and_cta ul.cta li a {min-width:0; padding:8px 20px; font-size:16px; line-height:18px; letter-spacing:1px;}
#nav_and_cta ul.cta li a span {padding:0 0;}
#nav_and_cta ul.cta li a span::after {content:none;}

.hml_add {display:none;}

section[id^="sc_"] > div {padding:50px 4% !important;}
section[id^="sc_"] > div > h2 {font-size:28px !important; margin:0 auto 10px auto;}
section[id^="sc_"] > div > h2 + p {margin:20px auto 0 auto;}


p.cta_btn {margin:0 auto;}
p.cta_btn a {padding:10px 10px; width:80%; font-size:20px;}
p.cta_btn + p {font-size:14px !important;}


section#sc_mv {margin:0 auto; padding:50px 0 0 0 !important;}
section#sc_mv > div#mv_box {padding:30px 4% !important; background:url(../img/mv.webp) no-repeat right 4% top 50% / 38% auto;}
section#sc_mv > div#mv_box > div {margin:0 0; padding:0 0;}
section#sc_mv > div#mv_box > div::after {bottom:-30px; padding-top:calc(72.32% * 0.45); width:45%;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) {font-size:20px;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong {padding:2px 10px;}
section#sc_mv > div#mv_box > div p:nth-of-type(2) {font-size:28px; line-height:1.5;}
section#sc_mv > div#mv_box > div p:nth-of-type(3) {margin:0 0 20px 0; font-size:32px;}
section#sc_mv > div#mv_box > div h1 {height:50px;}
section#sc_mv > div#mv_box > div h1::before {height:50px;}
section#sc_mv > div#mv_box > div > ul {margin:20px 0 0 0; padding:10px 10px;}
section#sc_mv > div#mv_box > div > ul li a {padding:10px 15px; font-size:16px; line-height:1.5; min-width:0;}


#sc_01 > div > div {justify-content:center; gap:70px 0; margin:30px auto 0 auto; padding:0 0;}
#sc_01 > div > div > dl {width:100%; max-width:500px;}
#sc_01 > div > div > dl::after {left:calc(50% - 25px); top:auto; bottom:-60px; width:50px; height:50px; clip-path:polygon(25% 0, 75% 0, 75% 40%, 100% 40%, 50% 100%, 0 40%, 25% 40%);}
#sc_01 > div > div > dl:nth-of-type(1)::before {}
#sc_01 > div > div > dl:nth-of-type(2)::before {}
#sc_01 > div > div > dl dt {font-size:16px;}
#sc_01 > div > div > dl dd {}

#sc_02 > div > h2 {height:50px;}
#sc_02 > div > h2::before {height:50px;}
#sc_02 > div > h2 + p {margin:20px auto 0 auto; font-size:22px;}
#sc_02 > div > div {padding:20px 0 0 0;}
#sc_02 > div > div > ul > li {gap:20px 20px; margin:0 auto 40px auto;}
#sc_02 > div > div > ul > li:nth-of-type(1) {flex-direction:row-reverse;}
#sc_02 > div > div > ul > li:nth-of-type(1)::before {width:30%; padding-top:calc(66.7% * 0.30);}
#sc_02 > div > div > ul > li:nth-of-type(2)::after {width:30%; padding-top:calc(66.7% * 0.30);}
#sc_02 > div > div > ul > li > dl {width:calc(100% - 30% - 20px);}
#sc_02 > div > div > ul > li > dl > dt {margin:0 0; padding:0 0 0 120px; min-height:75px; font-size:18px;}
#sc_02 > div > div > ul > li > dl > dt::before {width:100px; height:75px;}
#sc_02 > div > div > ul > li > dl > dd {margin:10px 0 0 0; font-size:14px;}
#sc_02 > div > div > ul > li > dl > dd span {display:inline;}
#sc_02 > div > div > ul > li > dl > dd:nth-of-type(2) ul {margin:20px auto 0 auto;}
#sc_02 > div > div > ul > li > dl > dd:nth-of-type(2) ul li {width:100%; padding:20px 20px;}
#sc_02 > div > div > ul > li > dl > dd:nth-of-type(2) ul li dl dt {font-size:18px;}

#sc_03 > div > div {margin:30px auto 0 auto;}
#sc_03 > div > div ul {gap:30px 30px;}
#sc_03 > div > div ul li {width:calc((100% - 60px) / 3); padding:50px 0 0 0; font-size:16px; background:linear-gradient(#0277c3 10px, #fff 10px, #fff 40px, #fff 50px, #0277c3 50px);}
#sc_03 > div > div ul li::before {width:50px; height:50px;}
#sc_03 > div > div ul li::after {right:-35px;}
#sc_03 > div > div ul li span {left:50px; width:calc(100% - 50px); height:50px;}
#sc_03 > div > div ul li dl {width:60%; padding:0 5px 0 0;}
#sc_03 > div > div ul li dl dt {margin:0 0 10px 50px; height:40px; font-size:22px; line-height:50px;}
#sc_03 > div > div ul li dl dd p:nth-of-type(2) {gap:5px 5px; padding:0 0; font-size:14px;}
#sc_03 > div > div ul li:nth-of-type(1) dl dd p:nth-of-type(2) {padding:0 0;}
#sc_03 > div > div ul li dl dd p:nth-of-type(2) span {border:1px solid #222;}
#sc_03 > div > div ul li dl dd p:nth-of-type(3) {font-size:12px;}

#sc_04 > div > div {margin:30px auto 0 auto;}
#sc_04 > div > div > dl dt {padding:10px 5px; font-size:22px;}
#sc_04 > div > div > dl dd {padding:40px 5px; font-size:18px;}

#sc_06 > div > div {margin:30px auto 0 auto;}
#sc_06 > div > div > ul#app_example_list > li {gap:10px 0;}
#sc_06 > div > div > ul#app_example_list > li div {font-size:18px;}
#sc_06 > div > div > ul#app_example_list > li div span:nth-last-of-type(1) {display:none;}
#sc_06 > div > div > ul#app_example_list > li::after {margin:0 auto 15px auto; width:calc(100% - 30px); height:30px; background-size:cover;}

#sc_06 > div > div > ul#app_example_wrap > li > dl {padding:20px 10px; border:10px solid #DEF1FF;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt {width:100%; padding:0 10px 10px 10px; font-size:22px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt h3 {font-size:22px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd h4 {margin:40px auto 20px auto; padding:0 20px 5px 20px; font-size:20px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div {padding:10px 10px; max-height:calc(100vh - 220px);}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p {font-size:14px; line-height:1.5; text-align:left;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p.ae_catch {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div figure {margin:20px auto 0 auto;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dt {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list > p {font-size:20px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div {margin:10px 10px; padding:10px 10px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div ul li {padding:0 0 0 11px; font-size:12px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list div ul li::before {top:calc(50% - 3px); width:6px; height:6px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price {gap:20px 20px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li {width:calc((100% - 20px) / 2); padding:0 0 20px 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li h5 {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p {font-size:36px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p span {font-size:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p span:nth-last-of-type(1) {font-size:11px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p.ae_memo {font-size:11px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a {padding:10px 20px; font-size:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span {padding:0 30px 0 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span::after {width:25px; height:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_l {left:-20px; top:calc(50% - 25px); width:50px; height:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_r {right:-20px; top:calc(50% - 25px); width:50px; height:50px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.ae_close_btn {width:50px; height:50px;}

.sc_cta > div ul.cta_btn::before {width:26%; padding-top:calc(94.8% * 0.26);}
.sc_cta > div ul.cta_btn li a {font-size:16px;}

#sc_02 + .sc_cta > div {padding:0 0 50px 0;}

#page-top {background:#f4f4f4;}


#footer {padding:20px 0 20px 0;}
#footer p a {margin:0 auto 10px auto; min-width:240px;}
#footer p a::before {height:40px;}
#footer small {margin:10px auto 0 auto;}

}


@media only screen and (max-width: 430px) {
#logo {height:34px;}
#logo a {height:34px;}

header #nav_and_cta {display:none;}

section[id^="sc_"] > div > h2 {max-width:calc(100% - 10px); font-size:18px !important;}
section[id^="sc_"] > div > h2::after {margin:10px 0 0 -5px; width:calc(100% + 10px); height:2px;}
section[id^="sc_"] > div > h2 + p {font-size:16px; text-align:left;}
section[id^="sc_"] > div > h2 + p span {display:inline;}

p.cta_btn a {padding:10px 10px; width:92%; font-size:18px; line-height:1.5;}
p.cta_btn + p {font-size:12px !important;}

section#sc_mv > div#mv_box {padding:20px 4% !important; background:url(../img/mv.webp) no-repeat right 8% bottom 20px / 35% auto;}
section#sc_mv > div#mv_box > div {padding:0 0;}
section#sc_mv > div#mv_box > div::after {position:static; margin:10px auto 0 auto; padding-top:calc(72.32% * 0.6); width:60%;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) {margin:0 0 5px 0; font-size:16px; line-height:1.6; text-align:center;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) span {display:block;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong {padding:2px 6px; line-height:1.4;}
section#sc_mv > div#mv_box > div p:nth-of-type(2) {margin:0 0 5px 0; font-size:20px; text-align:center;}
section#sc_mv > div#mv_box > div p:nth-of-type(2) span {display:inline-block;}
section#sc_mv > div#mv_box > div p:nth-of-type(3) {position:relative; margin:0 0 15px 0; font-size:22px; text-align:center;}
section#sc_mv > div#mv_box > div h1 {height:45px;}
section#sc_mv > div#mv_box > div h1::before {height:45px; background-position:left 50% top 50%;}
section#sc_mv > div#mv_box > div > ul {display:inline-block;}
section#sc_mv > div#mv_box > div > ul li {margin:0 0 10px 0;}
section#sc_mv > div#mv_box > div > ul li:nth-last-of-type(1) {margin:0 0;}
section#sc_mv > div#mv_box > div > ul li a {font-size:14px;}

#sc_01 > div > div > dl dd {padding:10px 15px 20px 1.5em; font-size:14px; line-height:1.5; font-weight:400;}
#sc_01 > div > div > dl dd ul li {margin:0 0 5px 1em;}
#sc_01 > div > div > dl dd ul li:nth-last-of-type(1) {margin:0 0 0 1em;}
#sc_01 > div > div > dl dd ul li span {display:inline;}
#sc_01 > div > h2 + p strong {white-space:nowrap;}

#sc_02 > div > h2 + p {font-size:18px;}
#sc_02 > div > h2 + p + p {font-size:14px; line-height:1.6; font-weight:400; text-align:left;}
#sc_02 > div > h2 + p + p span {display:inline;}
#sc_02 > div p:nth-of-type(1) {font-size:16px; line-height:1.6; text-align:center; font-family:'Noto Sans JP',sans-serif;}
#sc_02 > div p:nth-of-type(1) strong {padding:2px 6px; line-height:1.4;}
#sc_02 > div p:nth-of-type(1) strong:nth-last-of-type(1) {margin:0 0;}
#sc_02 > div > h2 {margin:20px auto 0 auto; height:45px;}
#sc_02 > div > h2::before {height:45px;}
#sc_02 > div > div ul {padding:0 0;}
#sc_02 > div > div ul li {width:100%;}
#sc_02 > div > div > ul > li:nth-of-type(1) {flex-direction:column-reverse;}
#sc_02 > div > div > ul > li:nth-of-type(2) {flex-direction:column;}
#sc_02 > div > div > ul > li:nth-of-type(1)::before {width:100%; padding-top:66.7%;}
#sc_02 > div > div > ul > li:nth-of-type(2)::after {width:100%; padding-top:66.7%;}
#sc_02 > div > div > ul > li:nth-last-of-type(1) > dl {text-align:left;}
#sc_02 > div > div > ul > li > dl {width:100%;}
#sc_02 > div > div > ul > li > dl > dt {padding:0 0 0 100px; font-size:16px; min-height:65px;}
#sc_02 > div > div > ul > li > dl > dt::before {width:90px; height:65px;}

#sc_03 > div > div {gap:20px 20px; margin:20px auto 0 auto;}
#sc_03 > div > div ul {gap:30px 30px;}
#sc_03 > div > div ul li {width:100%; padding:60px 0 0 0; background:linear-gradient(#0277c3 10px, #fff 10px, #fff 50px, #fff 60px, #0277c3 60px);}
#sc_03 > div > div ul li::before {width:60px; height:60px;}
#sc_03 > div > div ul li::after {right:auto; top:auto; left:calc(50% - 15px); bottom:-40px; transform:rotate(90deg);}
#sc_03 > div > div ul li span {justify-content:start; left:60px; width:calc(100% - 60px); height:60px; padding:0 0 0 20px;}

#sc_04 > div > div > dl {width:100%; border-radius:20px;}
#sc_04 > div > div > dl dd {padding:20px 5px;}
#sc_04 > div > div > dl:nth-of-type(2) dd div span:nth-of-type(1) {font-size:200%;}

#sc_06 > div > div > ul#app_example_list {gap:20px 20px;}
#sc_06 > div > div > ul#app_example_list > li {width:calc((100% - 20px) / 2);}
#sc_06 > div > div > ul#app_example_list > li div {font-size:14px;}
#sc_06 > div > div > ul#app_example_list > li::after {margin:0 auto 10px auto; width:calc(100% - 20px); height:26px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dt h3 {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd h4 {font-size:18px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div figure.ae_logo img {max-width:100%; max-height:80px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p.ae_catch {font-size:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div p.ae_catch span {display:inline;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list > p {font-size:16px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div dl.ae_detail dd.ae_list > p span {font-size:12px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li {width:100%;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd > div ul.ae_price li p {font-size:30px;}

#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_l {left:-10px; top:calc(50% - 20px); width:40px; height:40px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.side_btn_r {right:-10px; top:calc(50% - 20px); width:40px; height:40px;}
#sc_06 > div > div > ul#app_example_wrap > li > div.ae_close_btn {right:-10px; top:-10px; width:40px; height:40px;}


.sc_cta > div {padding:30px 4%;}
.sc_cta > div ul.cta_btn {padding:20px 20px; padding-left:calc(26% + 20px); justify-content:end;}


#footer {padding:20px 0 20px 0;}
#footer p a {margin:0 auto 10px auto; min-width:240px;}
#footer p a::before {height:40px;}
#footer small {margin:10px auto 0 auto;}
}


@media only screen and (max-width: 320px) {

section[id^="sc_"] > div > h2 + p {font-size:14px;}

section#sc_mv > div#mv_box > div p:nth-of-type(1) {font-size:14px;}
section#sc_mv > div#mv_box > div p:nth-of-type(1) strong {margin:0 5px 0 0;}
section#sc_mv > div#mv_box > div p:nth-of-type(2) {font-size:18px;}
section#sc_mv > div#mv_box > div p:nth-of-type(3) {font-size:20px;}
section#sc_mv > div#mv_box > div h1 {height:35px;}
section#sc_mv > div#mv_box > div h1::before {height:35px;}

#sc_01 > div > div > ul > li > dl dt span:nth-last-of-type(1) {min-width:92%;}

#sc_02 > div p:nth-of-type(1) {font-size:14px;}
#sc_02 > div p:nth-of-type(1) strong {margin:0 5px 0 0;}
#sc_02 > div > h2 {height:35px;}
#sc_02 > div > h2::before {height:35px;}

#sc_06 > div > div > ul#app_example_list {gap:10px 10px;}
#sc_06 > div > div > ul#app_example_list > li {width:calc((100% - 10px) / 2);}
#sc_06 > div > div > ul#app_example_list > li div {font-size:12px;}
#sc_06 > div > div > ul#app_example_list > li::after {width:calc(100% - 10px); height:24px;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span {padding:0 0;}
#sc_06 > div > div > ul#app_example_wrap > li > dl > dd p.ae_btn a span::after {content:none;}

.sc_cta > div ul.cta_btn {gap:15px 15px; padding:15px 15px; padding-left:calc(26% + 15px);}
.sc_cta > div ul.cta_btn li a {padding:10px 15px;}

}


section#sc_mv ul li {position:relative;}
section#sc_mv ul li > span {display:block; margin:0 auto 5px auto; padding:0 0; font-size:14px; line-height:1.5; text-align:center; white-space:nowrap; color:#222;}
section#sc_mv ul li > span::before,
section#sc_mv ul li > span::after {content:none;}

@media screen and (max-width: 1023px) {
#sc_mv ul li > span {display:none !important;}
}


section.sc_cta ul.cta_btn li {position:relative;}
section.sc_cta ul.cta_btn li > span {display:block; margin:0 auto 5px auto; padding:0 0; font-size:12px; line-height:1.5; text-align:center; white-space:nowrap; color:#222;}
section.sc_cta ul.cta_btn li > span::before {content:none;}
section.sc_cta ul.cta_btn li > span::after {content:none;}

@media screen and (max-width: 1023px) {
section.sc_cta ul.cta_btn li > span {display:none !important;}
}