/* CSS */

/* Striking Reset */


/* for PC Only - over 1024px */
@media screen and (min-width: 1024px){
.inner {width:1200px;}

.right_sidebar #main,
.right_sidebar #main .content,
.left_sidebar #main,
.left_sidebar #main .content {width:850px;}


#header .inner {width:100vw; padding:0 50px;}
#logo {left:50px;}
#navigation {right:50px;}
}



* {transition: 0.2s;
scroll-behavior: smooth;}

#feature,
#header {border-bottom:1px solid #fce3d3;}


h1, h2, h3, h4, h5,h6 {font-weight: 600; line-height: 1.4em;}

#main h2 {margin: 2em 0  1em 0 ;}



#main section {padding:3em 0;}


#feature .inner,
.feature-introduce {padding-bottom:0;}


    .feature_container {
      display: flex;
      width: 100%;
      min-height: 350px; /* デモ用の高さ */
    }

    .top_left {flex: 3;background: url(/cms/wp-content/uploads/2025/08/slidewise_001.png) right top no-repeat}
    .top_right {flex: 4; padding:1em 2em;}
	.top_right_inner {max-width: 75vw;}

    /* スマホなど小さい画面では左カラムを非表示 */
    @media (max-width: 768px) {
      .top_left {display: none;}
	  .top_right {flex: 1; }
    }



/* margin/ padding */

.m-0 {margin: 0 !important;}
.mt-0, .my-0 {margin-top: 0 !important;}
.mr-0, .mx-0 {margin-right: 0 !important;}
.mb-0, .my-0 {margin-bottom: 0 !important;}
.ml-0, .mx-0 {margin-left: 0 !important;}
.m-1 {margin: 0.25rem !important;}
.mt-1, .my-1 {margin-top: 0.25rem !important;}
.mr-1, .mx-1 {margin-right: 0.25rem !important;}
.mb-1, .my-1 {margin-bottom: 0.25rem !important;}
.ml-1, .mx-1 {margin-left: 0.25rem !important;}
.m-2 {margin: 0.5rem !important;}
.mt-2, .my-2 {margin-top: 0.5rem !important;}
.mr-2, .mx-2 {margin-right: 0.5rem !important;}
.mb-2, .my-2 {margin-bottom: 0.5rem !important;}
.ml-2, .mx-2 {margin-left: 0.5rem !important;}
.m-3 {margin: 1rem !important;}
.mt-3, .my-3 {margin-top: 1rem !important;}
.mr-3, .mx-3 {margin-right: 1rem !important;}
.mb-3, .my-3 {margin-bottom: 1rem !important;}
.ml-3, .mx-3 {margin-left: 1rem !important;}
.m-4 {margin: 1.5rem !important;}
.mt-4, .my-4 {margin-top: 1.5rem !important;}
.mr-4, .mx-4 {margin-right: 1.5rem !important;}
.mb-4, .my-4 {margin-bottom: 1.5rem !important;}
.ml-4, .mx-4 {margin-left: 1.5rem !important;}
.m-5 {margin: 3rem !important;}
.mt-5, .my-5 {margin-top: 3rem !important;}
.mr-5, .mx-5 {margin-right: 3rem !important;}
.mb-5, .my-5 {margin-bottom: 3rem !important;}
.ml-5, .mx-5 {margin-left: 3rem !important;}
.p-0 {padding: 0 !important;}
.pt-0, .py-0 {padding-top: 0 !important;}
.pr-0, .px-0 {padding-right: 0 !important;}
.pb-0, .py-0 {padding-bottom: 0 !important;}
.pl-0, .px-0 {padding-left: 0 !important;}
.p-1 {padding: 0.25rem !important;}
.pt-1, .py-1 {padding-top: 0.25rem !important;}
.pr-1, .px-1 {padding-right: 0.25rem !important;}
.pb-1, .py-1 {padding-bottom: 0.25rem !important;}
.pl-1, .px-1 {padding-left: 0.25rem !important;}
.p-2 {padding: 0.5rem !important;}
.pt-2, .py-2 {padding-top: 0.5rem !important;}
.pr-2, .px-2 {padding-right: 0.5rem !important;}
.pb-2, .py-2 {padding-bottom: 0.5rem !important;}
.pl-2, .px-2 {padding-left: 0.5rem !important;}
.p-3 {padding: 1rem !important;}
.pt-3, .py-3 {padding-top: 1rem !important;}
.pr-3, .px-3 {padding-right: 1rem !important;}
.pb-3, .py-3 {padding-bottom: 1rem !important;}
.pl-3, .px-3 {padding-left: 1rem !important;}
.p-4 {padding: 1.5rem !important;}
.pt-4, .py-4 {padding-top: 1.5rem !important;}
.pr-4, .px-4 {padding-right: 1.5rem !important;}
.pb-4, .py-4 {padding-bottom: 1.5rem !important;}
.pl-4, .px-4 {padding-left: 1.5rem !important;}
.p-5 {padding: 3rem !important;}
.pt-5, .py-5 {padding-top: 3rem !important;}
.pr-5, .px-5 {padding-right: 3rem !important;}
.pb-5, .py-5 {padding-bottom: 3rem !important;}
.pl-5, .px-5 {padding-left: 3rem !important;}
.m-n1 {margin: -0.25rem !important;}
.mt-n1, .my-n1 {margin-top: -0.25rem !important;}
.mr-n1, .mx-n1 {margin-right: -0.25rem !important;}
.mb-n1, .my-n1 {margin-bottom: -0.25rem !important;}
.ml-n1, .mx-n1 {margin-left: -0.25rem !important;}
.m-n2 {margin: -0.5rem !important;}
.mt-n2, .my-n2 {margin-top: -0.5rem !important;}
.mr-n2, .mx-n2 {margin-right: -0.5rem !important;}
.mb-n2, .my-n2 {margin-bottom: -0.5rem !important;}
.ml-n2, .mx-n2 {margin-left: -0.5rem !important;}
.m-n3 {margin: -1rem !important;}
.mt-n3, .my-n3 {margin-top: -1rem !important;}
.mr-n3, .mx-n3 {margin-right: -1rem !important;}
.mb-n3, .my-n3 {margin-bottom: -1rem !important;}
.ml-n3, .mx-n3 {margin-left: -1rem !important;}
.m-n4 {margin: -1.5rem !important;}
.mt-n4, .my-n4 {margin-top: -1.5rem !important;}
.mr-n4, .mx-n4 {margin-right: -1.5rem !important;}
.mb-n4, .my-n4 {margin-bottom: -1.5rem !important;}
.ml-n4, .mx-n4 {margin-left: -1.5rem !important;}
.m-n5 {margin: -3rem !important;}
.mt-n5, .my-n5 {margin-top: -3rem !important;}
.mr-n5, .mx-n5 {margin-right: -3rem !important;}
.mb-n5, .my-n5 {margin-bottom: -3rem !important;}
.ml-n5, .mx-n5 {margin-left: -3rem !important;}
.m-auto {margin: auto !important;}
.mt-auto, .my-auto {margin-top: auto !important;}
.mr-auto, .mx-auto {margin-right: auto !important;}
.mb-auto, .my-auto {margin-bottom: auto !important;}
.ml-auto, .mx-auto {margin-left: auto !important;}

/* -- */


.narrow {max-width:695px; margin: auto;}


.sp-ea-single {border-top:none !important; border-left:none !important; border-right:none !important;}
.sp-ea-single .ea-header a {padding:20px 0 25px 0 !important;}
.sp-ea-single:first-child {border-top:1px solid #e2e2e2 !important; padding-top:10px !important;}

.orange_line {margin: 0 calc(50% - 50vw);width: 100vw;border:1px solid #fce3d3 }

.bg-light {background: #faf7f5;}
.fullwidth {margin: 0 calc(50% - 50vw); width: 100vw;}


.button {border-radius: 5px;}

.stack_icons .fa-circle {color:#fff5f1}
.stack_icons .fa-duotone {color:#f06e3d;}

.video_desc {padding:4em; max-width:300px; margin: auto;}



.linkbox {display: block; width:300px; height:230px; background: #0fa386; color:#fff !important; border-radius: 10px; text-align: center; margin: auto;
padding:30px 0 0; font-weight: bold; font-size:18px;
border:6px solid #86c8b6;}
.linkbox:hover {background:#26CFAE; }
.linkbox i {margin-bottom:20px; font-size:500%;}
.linkbox p {font-size:20px;}

.stack_icons {font-size:130%;}

    ul.custom-checklist {
      list-style: none;
      padding: 0;
	  margin-left: 0;
    }

    ul.custom-checklist li {
      position: relative;
      padding-left: 2.5em; /* アイコンサイズに応じて余白も調整 */
      margin-bottom: 0.5em;
    }

    ul.custom-checklist li::before {
      content: "\f00c"; /* FontAwesome チェックマーク */
      font-family: "Font Awesome 6 Pro";
      font-weight: 900;
      color: #e44e1f;
      background-color: #ffe9e2;
      border-radius: 50%;
      width: 25px;
      height: 25px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      left: 0;
      top: 0.15em;
      font-size: 0.75em; /* サイズに応じて文字も少し小さく */
    }


.og_btn {display: inline-block; border:2px solid #f06e3e; background: #f06e3e; border-radius: 5px; color:#fff !important; padding:0.5em 1em; margin:1em;}
.go_btn {display: inline-block; border:2px solid #f06e3e; background: #FFF; border-radius: 5px; color:#f06e3e !important; padding:0.5em 1em; margin:1em;}
.og_btn:hover {background:#F99D7B;}
.go_btn:hover {background:#FFEEE9; }

.accordion a {font-size:24px;}
.accordion .pane {font-size:16px;}


.video_frame {width:auto; height: auto;}

.cta_catch {font-weight: bold; font-size:26px; line-height: 1.3em; margin: 1em 0 2em;}


/* EACH PAGE */

/*
.slug-support #feature h1 {margin-top:3em;}

.slug-support #feature,
.slug-form #feature,
.slug-trial #feature,
.slug-contact #feature {min-height:350px;}


.slug-support .feature-introduce,
.slug-form  .feature-introduce,
.slug-trial .feature-introduce,
.slug-contact .feature-introduce { margin-top:3em; margin-left:400px;}

*/

/* FOOTER */

#copyright {float: none;}
#footer_bottom {text-align:center;}

#footer .widget {margin-bottom:1em;}


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

/*
.slug-support .feature-introduce,
.slug-form  #feature .feature-introduce,
.slug-trial #feature .feature-introduce,
.slug-contact #feature .feature-introduce {background:rgba(245,245,245,0.70); padding:1em; border-radius: 5px; border:1px solid #F99D7B;margin:1em;}
*/

}