.pt-100{
    padding-top: 100%;
}
.rounded-lg	{
    border-radius: 0.5rem;
}
.rounded-xl	{
    border-radius: 0.75rem;
}
.rounded-2xl {
    border-radius: 1rem;
}
.rounded-3xl{
    border-radius: 1.5rem;
}
.rounded-b-r-3xl{
    border-bottom-right-radius: 1.5rem;
}
.rounded-l-xl{
    border-top-left-radius:0.75rem;
    border-bottom-left-radius:0.75rem;
}
.left-100{
    left: 100%;
}
.sortable-chosen{
    box-shadow:8px 8px 32px #e1e1e1;
}
.stroke-gray{
    stroke: #e2e8f0;
}
.fill-white{
    fill: #FFF;
}
.fill-green{
    fill: #8fc31f;
}
.sortable-drag{
    opacity:0;
}
.whitespace-nowrap{
    white-space:nowrap;
}
.atouch-title {
    position: relative;
    display: inline-block;
    background: url(../images/atouch-title_left.png) left center no-repeat,url(../images/atouch-title_right.png) right center no-repeat;
    background-size: 60px auto,60px auto;
    padding-left: calc(60px + 1em);
    padding-right: calc(60px + 1em); 
    min-height: 61px;
    line-height:60px!important;
}
.atouch-sub-title {
    position: relative;
    background: url(../images/atouch-title_left.png) left center no-repeat;
    background-size: 40px auto;
    padding-left: calc(40px + 0.5em);
    min-height: 40px;
    line-height:40px!important;
}
.rounded-2xl{ border-radius: 1rem; }
.bg-green {
    --bg-opacity: 1;
    background-color: #8fc31f;
    background-color: rgba(143, 195, 31, var(--bg-opacity));
}
.bg-green-450 {
    --bg-opacity: 1;
    background-color: #42aa1a;
    background-color: rgba(66, 170, 26, var(--bg-opacity));
}

.bg-line {
    --bg-opacity: 1;
    background-color: #8DE055;
    background-color: rgba(141, 224, 85, var(--bg-opacity));
}

.bg-blue{
    --bg-opacity: 1;
    background-color: #00b9ef;
    background-color: rgba(0, 185, 239, var(--bg-opacity)); 
}

.bg-yellow{
    --bg-opacity: 1;
    background-color: #f8b62d;
    background-color: rgba(248, 182, 45, var(--bg-opacity)); 
}

.bg-pink{
    --bg-opacity: 1;
    background-color: #f27ba3;
    background-color: rgba(242, 123, 163, var(--bg-opacity)); 
}

.text-green {
    --text-opacity: 1;
    color: #8fc31f;
    color: rgba(143, 195, 31, var(--text-opacity));
}

.text-blue {
    --text-opacity: 1;
    color: #00b9ef;
    color: rgba(0, 185, 239, var(--text-opacity));
}

.text-yellow {
    --text-opacity: 1;
    color: #f8b62d;
    color: rgba(248, 182, 45, var(--text-opacity));
}

.border-green {
    --tw-border-opacity: 1;
    border-color: rgba(143, 195, 31, var(--tw-border-opacity));
}

.border-blue {
    --tw-border-opacity: 1;
    border-color: rgba(0, 185, 239, var(--tw-border-opacity));
}

.border-yellow {
    --tw-border-opacity: 1;
    border-color: rgba(248, 182, 45, var(--tw-border-opacity));
}

.border-red {
    --tw-border-opacity: 1;
    border-color: rgba(240, 82, 82, var(--tw-border-opacity));
}

ul.atouch-list{list-style:none}
  
ul.atouch-list li::before {
    content: "\2742";
    color: rgba(143, 195, 31, 1);
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left:-1em;
    position: initial;
    background: transparent;
    height: auto;
    top: auto;
    left: auto;
    border-radius: initial;
}
ul.atouch-list.blue li::before {
    color: rgba(0, 185, 239, 1);
}
ul.atouch-list.yellow li::before {
    color: rgba(248, 182, 45, 1);
}
ul.atouch-list li{padding-left:1em}

.side-btn-area {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translate(0,-50%);
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 75px;
}
.side-btn-area a {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    min-height: 150px;
    padding-bottom: 20px;
    color: #fff;
    writing-mode: vertical-rl;
    line-height: 1.3;
    transition: all .5s ease-in-out;
}
.side-btn-area a.sidebtn01 {
    background: #f8b62b;
    border-radius: 1em 0 0 1em;
    border: 2px solid #f8b62b;
}
.side-btn-area a.sidebtn01:hover{
    background: #fff;
    color: #f8b62b;
  }
.side-btn-area a::before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    border: 1px solid #fff;
    border-radius: 50%;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,-10px);
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.side-btn-area a.sidebtn01:hover::before {
    border: 1px solid #f8b62b;
}
.side-btn-area a::after {
    content: "";
    display: block;
    margin-top:5px;
    width: 24px;
    height: 24px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,-10px);
    background: url(../images/arrow_white.png) center center no-repeat;
    background-size: 10px 10px;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.side-btn-area a.sidebtn01:hover::after {
    background: url(../images/arrow_orange.png) center center no-repeat;
    background-size: 10px 10px;
}

[x-cloak] { display: none; }

.max-w-100{  max-width: 100px; }

*::-webkit-scrollbar{visibility:hidden;width:10px}
*::-webkit-scrollbar-thumb{visibility:hidden}
*:hover::-webkit-scrollbar-thumb{visibility:visible}
*::-webkit-scrollbar{background-color:#f9fafb!important}
*::-webkit-scrollbar-thumb{background-color:#FFF!important;border:1px solid #f1f1f1}
.theme-dark *::-webkit-scrollbar{background-color:#1a1c23!important}
.theme-dark *::-webkit-scrollbar-thumb{background-color:#64748b29!important;border:1px solid #4c4f52}

.text-xxs {
    font-size: 0.6rem;
    line-height: 0.75rem;
  }

.emojionearea-button {
    z-index: 5;
    position: absolute;
    left: 3px;
    top: 3px;
    width: 24px;
    height: 24px;
    opacity: .6;
    cursor: pointer;
    -moz-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out
}
.emojionearea-button:hover {
    opacity: 1
}
.emojionearea-button > div {
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out
}

.emojionearea-button>div.emojionearea-button-open {
    background-position: 0 -24px;
    filter: alpha(enabled=false);
    opacity: 1
}

.emojionearea-button>div.emojionearea-button-close {
    background-position: 0 0;
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    filter: alpha(Opacity=0);
    opacity: 0
}

.emojionearea-button.active>div.emojionearea-button-open {
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    filter: alpha(Opacity=0);
    opacity: 0
}

.emojionearea-button.active>div.emojionearea-button-close {
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
    filter: alpha(enabled=false);
    opacity: 1
}

.emojionearea-button>div{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAABuCAYAAADMB4ipAAAHfElEQVRo3u1XS1NT2Rb+9uOcQF4YlAJzLymFUHaLrdxKULvEUNpdTnRqD532f+AHMLMc94gqR1Zbt8rBnUh3YXipPGKwRDoWgXvrYiFUlEdIkPPYZ/dAkwox5yQCVt/bzRrBPnt9e+211/etFeDQDu3ArL+/X37OeqmRWoH7+vpItfWawStF1tfXR+zW9xW5ne0p8loOcAKuCdwpRft60C8a+X5zTvebCqcAvmidf1GGHtqhHdpf1qqKzsrKipyensbi4iKWl5cBAMFgEG1tbYhGo2hpadlbmxseHpaDg4MAgI6ODng8HgBAPp/H/Pw8AODatWvo7e2tvUHrui7v3r2L+fl5XL58GVeuXIHH49m1N5/Py0ePHmF0dBQdHR24desWVFXdtYdXAn/48CHm5+dx8+ZNRKPRigEUDpuenpb3799H4YaOnWh5eVmOj48jFoshGo0STdPkwMCAXF5elqV7BgYGpKZpMhqNklgshrGxMbx580Y6gicSCTDGEIvFAADpdBqpVArJZLK4J5lMIpVKIZ1OAwBisRgYY0gkEs6Rp1IphMNh+Hw+AgCGYQAANE0r7in8Xfjm8/lIOBzGq1evnMHX19fR1NRU/D8UCoFzjnA4XFwLh8PgnCMUChXXmpqakM1mUfVBS62xsZHk83lZWi1nz579ZA0AhBDO4A0NDchkMsWSJIRAURRiVy26rktVVUkmk0EgEHAGP3XqFKamppDP56Vpmrhz5w5u374t/X4/OP+w3TRNZLNZ6LoO0zSRz+dlf38/Ll686Jzz8+fPQwiBeDwOt9tNrl+/jkwmU6yaQpVkMhncuHEDbrebxONxCCEQiUScIw8Gg+TBgwdyZGQEyWRSdnV1kVQqJYeGhrC6ugrGGEKhEHp7e3Hy5EmSTCblvXv30NPTg2AwSA6M/vF4HCMjI7b0/yzh8vv9AIBsNrt34aokuQsLC7skt729varkHtqftUFf++FHsrq0QN3eBvp68Tfvf9Mv12oFCYU7G//e9nVuO7dpNbe2W4M//yQr0p8yRvyBo1Zr++lwLcCt7afD/sBRizJGavrB1dDYYh47Htrq+Kb7jBNwxzfdZ44dD201NLaYVUkU7ozQpuAJBkARwnRZpunN5zaa5hJjiXLH05GeiMd7JEM5zzHGNQBGZvk/Iv0yYVWMvK0zKk1Dl6ahW5RQobjqdjy+wEZn9PKF0n2d0csXPL7AhuKq26GECtPQLdPQZVtn1LlB69p7yRVVSEiDEGJwRd12e4+8PR3piRQidnuPvOWKuk0IMSSkwRVV6Np7WVVbSqvGsgSnlKkAFNPQXdrOtuKqcxtcUTUAhmUJnVJmlleJo3CVHmAaOlPUOmYJkxFKibQsSRkXhr4juKIKO2BHVSwcoLrqCVdUYho6K3YYRRWmoUtdey/tgKtK7rUffiQAsLq08MnbNLe2WwBgB/zHzueFyD8nwlIfbvdx8eU0WV1aKD1cVAMs9+F2j9gUPEEKemEJIe3AnXy4XfkBoNKSZHNthWfX31EA69VKttyHVyIOY1wRwmS6tqNsrr31vXo5k/bUu4gT2cp9lhbm0rzCJpeUUrE0vS63+c7/6uXMbDUWl/ssLczNFrVFddUT09AZpUy1LKvO0DVfPrfR9HxqfNbuEe185l9MFX3o6tIC5YpKFLWOfdQQ93Zu49j0+FDCDtjOp1yaOQCYhs4Y40wI05XfWj8yPT40Ua2ey33mEmMTtp2IUEq0nW3FKeJPGPjRp1Iz2QUuLUu66txG9NLVSK3gBZ+C1lcE54oqKOOCK6rm8QU2unu+u1ANuNynvFsBAG1ubbdMQ5eGviMAFDuP0w3sfMpvQEtb24fOQncU1bXl8R7JnOu+ZNv97XxKJwY6+PNPsrm13drObVqUMlMIU5OWpVHOc96Go5lTnV2fzC/VfAozD7HTCa6olBBa1Imlhbmq2lLuQ5xaW6nCPfnln0Yt7bDUhzhps8cfKH5//uTXmvS81OeLdqI/ZoROzSZrHqG/OvOPzxuhK5VgJTvV2bW3EdqJRABwrvvS/kfoSkoZvXT1YEbociHr7vnuYEfogpBFL109HKH/h0fomnXg3Lff79r7/MmvVbWG7gX4QObzc99+Tz7mHKah05KcW6ahQ9feS6cbMCdgt7eBWJagjCuUAC5tZzuouuo0Spm0hElc9R4cbf4bVl8v1p6WUmCuqEwIs34ruxaeeTy4uJVd67As08UVlVmWoG5vA7FLG3WMmHEupVTyW+vh2cn4DADMTsaTuc21LiGEhzHOnQ6gNtMrJSBMCKHkNt999WLi0S7hejEZH81n174WpukiIMw0dKq66p3Bw50RwhUVXFGJKUy28Xal48VkfKrSlWenhsc23q2cEB9SR7iiItwZIbbgHn8AlDFCCMW7laXjqZnHjkNpaubJzNuVpWZCKChjxOMPVH/QlaW0f/G3ZLqWWl6ce/bvlddp7yFD/w8Z+njoX1+GoZMjgzMAMDkyeLAMnRh+uKveJ0YGD4ahEyODFRk6OfrL/hj67GnckaHPng7vjaGzyYmaGDr77KktQ38H8tqx8Wja+WIAAAAASUVORK5CYII=)!important
}


.cs-info-title-1 {
    background: linear-gradient(to right, #30c38c, #bbed7a);
}
.cs-info-title-2 {
    background: linear-gradient(to right, #30c38c, #8eedf3);
}

.-my-1-5 {
    margin-top: -0.4rem;
    margin-bottom: -0.4rem;
}
.cs-info-title-3-bg{
    background: linear-gradient(50deg, rgba(55,197,140,0) 0%,rgba(55,197,140,0) 10%,rgba(183,236,122,0.5) 35%,rgba(56,197,139,1) 60%,rgba(56,197,139,1) 100%); 
}
.cs-info-3-text-shadow{
    text-shadow: rgba(56,197,139,1) 1px 0 5px;
}
.cs-info-title-4-bg{
    background-image: url(../images/cs-img-5-bg.png);
    background-size: cover;
    background-position: left center;
}
.cs-info-4-text-shadow{
    text-shadow: rgba(255,91,82,1) 1px 0 5px;
}

.cs-info-title-5{
    background-image: url(../images/cs-img-3-bg.jpg);
    background-size: contain;
    background-position: right center;
    background-repeat: no-repeat;
    position:relative;
}
.cs-info-title-5::before{
    content: ''; /* 必ず content プロパティを使用 */
    position:absolute;
    width: 100%; 
    height: 100%;
    background: linear-gradient(to right, rgba(116,155,242,1) 0%,rgba(116,155,242,1) 60%,rgba(116,155,242,0) 80%,rgba(116,155,242,0) 100%); 
    z-index:1;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}