@charset "UTF-8";
@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);
/*--------------------
共通設定
----------------------*/
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

a {
  text-decoration: none;
  color: #727171; }
  a.disabled {
    pointer-events: none;
    text-decoration: none; }

ul, ol {
  list-style: none; }

.pc {
  display: block; }
  @media screen and (max-width: 1300px) {
    .pc {
      display: none; } }

.sp {
  display: none; }
  @media screen and (max-width: 1300px) {
    .sp {
      display: block; } }

body {
  overflow-x: hidden; }

.wrapper {
  margin: 0 auto !important; }

main {
  max-width: 100%; }

.mainBox {
  margin: 0 auto !important; }

footer {
  position: relative;
  z-index: 9999; }

/*--------------------------------------------*/
#feature_240308 {
  /* lp_mainBox */ }
  #feature_240308.lp_wrapper {
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0;
    letter-spacing: 0.1em;
    color: #727171;
    font-size: 16px;
    text-align: center;
    font-family: "yu-gothic-pr6n", sans-serif;
    font-weight: 700 !important;
    font-style: normal;
    overflow-x: hidden; }
    #feature_240308.lp_wrapper .loading_lp {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: 9999;
      background: #fffff5; }
      #feature_240308.lp_wrapper .loading_lp.hidden {
        display: none;
        transition: .4s;
        opacity: 0; }
      #feature_240308.lp_wrapper .loading_lp .wrap {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); }
        @media screen and (max-width: 500px) {
          #feature_240308.lp_wrapper .loading_lp .wrap {
            width: 100%; } }
        #feature_240308.lp_wrapper .loading_lp .wrap.js-box {
          opacity: 0; }
        #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox {
          width: fit-content;
          margin: 3% auto;
          position: relative; }
          @media screen and (max-width: 500px) {
            #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox {
              margin: 10% auto 0; } }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox .l_anime_1 {
            opacity: 0; }
            #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox .l_anime_1.hidden {
              transition: .6s;
              opacity: 1; }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox .l_anime_2 {
            position: absolute;
            bottom: 0;
            right: -1.0em;
            max-width: 100px;
            opacity: 0; }
            #feature_240308.lp_wrapper .loading_lp .wrap .l_animeBox .l_anime_2.hidden {
              transition: .6s;
              opacity: 1; }
        #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_3 {
          max-width: 230px;
          margin: 0 auto;
          opacity: 0; }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_3.hidden {
            transition: .6s;
            opacity: 1; }
        #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_4 {
          opacity: 0; }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_4.hidden {
            transition: .6s;
            opacity: 1; }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_4 .txt {
            font-size: 1.2em; }
          #feature_240308.lp_wrapper .loading_lp .wrap .l_anime_4 img {
            max-width: 350px; }
    #feature_240308.lp_wrapper section {
      margin: 15% auto; }
    #feature_240308.lp_wrapper .top p {
      font-size: 0.9em;
      text-align: center;
      line-height: 2.2;
      margin-top: 10%; }
    #feature_240308.lp_wrapper .top.pc {
      left: 10%;
      top: 50%;
      transform: translateY(-50%);
      position: fixed;
      z-index: 1001;
      width: calc((100% - 33.3rem) * 0.5); }
    #feature_240308.lp_wrapper .animeBox {
      position: relative;
      margin: 0 auto;
      text-align: center; }
      #feature_240308.lp_wrapper .animeBox .txt {
        line-height: 1.0;
        position: absolute;
        top: 50%;
        left: 40%;
        transform: translate(-50%, -50%);
        color: #e95514;
        font-size: 1.4em;
        letter-spacing: 0.2em;
        margin: 0; }
      #feature_240308.lp_wrapper .animeBox .anime_1 {
        position: relative;
        z-index: -1;
        transform-origin: right;
        animation: yurayura 2.0s linear infinite; }
  #feature_240308 .lp_mainBox {
    width: 100%;
    height: 100%;
    position: relative;
    background: #fffff5; }
    #feature_240308 .lp_mainBox .sidearea {
      position: fixed;
      top: 0;
      height: 100%;
      overflow: hidden; }
      @media screen and (max-width: 1300px) {
        #feature_240308 .lp_mainBox .sidearea {
          width: calc((100% - 33.3rem) * 0.5); } }
      #feature_240308 .lp_mainBox .sidearea.boxleft {
        width: calc(100% - 550px - 10%);
        left: 0; }
      #feature_240308 .lp_mainBox .sidearea.boxright {
        right: 0;
        width: 10%; }
    #feature_240308 .lp_mainBox #box-content {
      position: relative;
      overflow: auto;
      -ms-overflow-style: none;
      z-index: 1000;
      /* drawer */ }
      #feature_240308 .lp_mainBox #box-content #drawer {
        padding: 0;
        position: relative;
        top: 0;
        background: #fffff5;
        overflow: hidden;
        max-width: 550px;
        top: 0;
        left: calc(100% - 550px - 10%);
        border: 30px solid #13ab67; }
        @media screen and (max-width: 1300px) {
          #feature_240308 .lp_mainBox #box-content #drawer {
            left: 0;
            margin: 0 auto; } }
        @media screen and (max-width: 500px) {
          #feature_240308 .lp_mainBox #box-content #drawer {
            max-width: none;
            border-left: none;
            border-right: none; } }
        #feature_240308 .lp_mainBox #box-content #drawer .top {
          position: relative;
          width: 80%;
          margin: 10% auto; }
          @media screen and (max-width: 500px) {
            #feature_240308 .lp_mainBox #box-content #drawer .top {
              width: 75%; } }
          @media screen and (max-width: 500px) {
            #feature_240308 .lp_mainBox #box-content #drawer .top p {
              font-size: 3.0vw; } }
          #feature_240308 .lp_mainBox #box-content #drawer .top .anime_1 {
            z-index: auto; }
          #feature_240308 .lp_mainBox #box-content #drawer .top .txt {
            width: 100%; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .top .txt {
                font-size: 5.0vw; } }
        #feature_240308 .lp_mainBox #box-content #drawer .loop_wrap {
          display: flex;
          overflow: hidden; }
          #feature_240308 .lp_mainBox #box-content #drawer .loop_wrap img {
            min-width: 600px;
            min-height: 32px; }
            #feature_240308 .lp_mainBox #box-content #drawer .loop_wrap img:first-child {
              animation: loop 30s linear -15s infinite; }
            #feature_240308 .lp_mainBox #box-content #drawer .loop_wrap img:last-child {
              animation: loop2 30s linear infinite; }
        #feature_240308 .lp_mainBox #box-content #drawer .list-block {
          margin: 30% auto; }
        #feature_240308 .lp_mainBox #box-content #drawer .ttl {
          margin: 0 auto 10%;
          position: relative; }
          #feature_240308 .lp_mainBox #box-content #drawer .ttl h2 {
            position: absolute;
            font-size: 1.0em;
            top: 1.0em;
            font-weight: 700 !important;
            line-height: 1.0;
            left: 50%;
            width: 100%;
            transform: translateX(-50%); }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .ttl h2 {
                font-size: 3.7vw;
                top: 1.4em; } }
        #feature_240308 .lp_mainBox #box-content #drawer .listBox {
          width: calc(100% - 26px);
          margin: 0 auto;
          position: relative; }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox h3 {
            font-size: 1.0em;
            color: #ffffff;
            background: #13ab67;
            border-top-left-radius: 50vh;
            border-top-right-radius: 50vh;
            padding: 1.0em 0;
            font-weight: 700 !important;
            line-height: 1.0; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .listBox h3 {
                font-size: 3.4vw;
                line-height: 1.2; } }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox h3.orange {
              background: #e95514; }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox div {
            border: 3px solid #13ab67;
            border-bottom: none;
            padding: 2.0em 1.0em 1.0em;
            width: 100%;
            margin: 0 auto;
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            flex-wrap: wrap; }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox div.orange {
              border: 3px solid #e95514;
              border-bottom: none; }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox .gizagiza {
            position: relative; }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox .gizagiza::after {
              height: 20px;
              content: "";
              position: absolute;
              left: 0;
              bottom: -4px;
              width: 100%;
              background: linear-gradient(150deg, #fffff5 12px, transparent 0), linear-gradient(210deg, #fffff5 12px, transparent 0);
              background-size: 22px 22px; }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox .gizagiza::before {
              height: 20px;
              content: "";
              position: absolute;
              left: 0;
              bottom: -7px;
              width: 100%;
              background: linear-gradient(150deg, #13ab67 12px, transparent 0), linear-gradient(210deg, #13ab67 12px, transparent 0);
              background-size: 22px 22px; }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox .gizagiza.orange::before {
              height: 20px;
              content: "";
              position: absolute;
              left: 0;
              bottom: -7px;
              width: 100%;
              background: linear-gradient(150deg, #e95514 12px, transparent 0), linear-gradient(210deg, #e95514 12px, transparent 0);
              background-size: 22px 22px; }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox ul {
            width: calc(100%/2 - 2%); }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li {
              display: flex;
              align-items: center;
              justify-content: flex-start;
              position: relative;
              margin-bottom: 0.7em; }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li p {
                background: #9e9f9f;
                color: #fff;
                font-size: 0.7em;
                padding: 0.5em;
                line-height: 1.0;
                width: 100%; }
                @media screen and (max-width: 500px) {
                  #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li p {
                    font-size: 2.7vw; } }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li span {
                font-size: 0.7em;
                text-align: left;
                padding-left: 2.0em; }
                @media screen and (max-width: 500px) {
                  #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li span {
                    font-size: 2.7vw; } }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li input[type=checkbox] {
                display: none; }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li input[type=checkbox] + label:before {
                position: absolute;
                top: 50%;
                left: 0;
                transform: translateY(-50%);
                font-family: FontAwesome;
                display: inline-block;
                content: "\f096";
                letter-spacing: 10px;
                font-size: 1.5em;
                color: #13ab67; }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li input[type=checkbox] + label.color:before {
                color: #727171; }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li input[type=checkbox]:checked + label:before {
                content: "\f046";
                letter-spacing: 5px; }
              #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li label {
                padding-left: 2.0em;
                text-align: left;
                font-size: .9em; }
                @media screen and (max-width: 500px) {
                  #feature_240308 .lp_mainBox #box-content #drawer .listBox ul li label {
                    font-size: 2.9vw; } }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox .anime_2 {
            position: absolute;
            bottom: -40px;
            right: 20px; }
          #feature_240308 .lp_mainBox #box-content #drawer .listBox .fade {
            opacity: 1;
            transform: scale(0); }
            #feature_240308 .lp_mainBox #box-content #drawer .listBox .fade.fadeanime {
              opacity: 1;
              transform: scale(1);
              transition: .3s; }
        #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents {
          margin-bottom: 15%; }
          #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .toggle_title {
            position: relative;
            cursor: pointer; }
            #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .toggle_title.selected .toggle_btn {
              transform: rotate(0deg); }
          #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .toggle_btn {
            position: absolute;
            bottom: -15px;
            right: 30px;
            z-index: +1;
            transition: .5s;
            transform: rotate(180deg);
            cursor: pointer; }
          #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .show {
            display: none;
            padding-bottom: 0;
            border-bottom: none;
            margin-bottom: -20px; }
            #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .show ul {
              display: table-cell;
              text-align: center;
              width: calc(100%/2 - 5%); }
          #feature_240308 .lp_mainBox #box-content #drawer .toggle_contents .gizagiza {
            border-top: none; }
        #feature_240308 .lp_mainBox #box-content #drawer .download {
          margin: 20% auto 5%; }
        #feature_240308 .lp_mainBox #box-content #drawer .button a {
          position: relative;
          color: #ffffff;
          background: #13ab67;
          line-height: 4.0;
          display: block;
          width: 80%;
          margin: 0 auto;
          font-size: 0.9em;
          border-radius: 50vh;
          height: 60px; }
          @media screen and (max-width: 500px) {
            #feature_240308 .lp_mainBox #box-content #drawer .button a {
              font-size: 3.2vw;
              width: 90%;
              height: 50px; } }
          #feature_240308 .lp_mainBox #box-content #drawer .button a.lines {
            line-height: 1.2;
            padding-top: 1.0em; }
          #feature_240308 .lp_mainBox #box-content #drawer .button a::after {
            position: absolute;
            content: url("https://carrot.itembox.design/item/images/feature/emergencykit/images/SVG/icon_3.svg");
            top: 4px;
            right: 4px;
            width: 52px;
            height: 52px; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .button a::after {
                width: 42px;
                height: 42px; } }
          #feature_240308 .lp_mainBox #box-content #drawer .button a:hover {
            opacity: .7;
            transition: .4s; }
        #feature_240308 .lp_mainBox #box-content #drawer .txtBox {
          width: 90%;
          margin: 10% auto; }
          #feature_240308 .lp_mainBox #box-content #drawer .txtBox p {
            font-size: 0.8em; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .txtBox p {
                font-size: 3.2vw; } }
          #feature_240308 .lp_mainBox #box-content #drawer .txtBox a {
            display: block;
            font-size: 0.6em;
            letter-spacing: 0;
            text-decoration: underline; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .txtBox a {
                font-size: 2.9vw;
                text-align: left; } }
        #feature_240308 .lp_mainBox #box-content #drawer h4 {
          font-size: 1.3em;
          line-height: 1.3;
          font-family: "futura-pt-bold", sans-serif;
          letter-spacing: .2em;
          position: relative;
          padding: 0.5em 2.0em;
          width: fit-content;
          margin: 0 auto;
          font-weight: 600 !important; }
          @media screen and (max-width: 500px) {
            #feature_240308 .lp_mainBox #box-content #drawer h4 {
              font-size: 4.5vw; } }
          #feature_240308 .lp_mainBox #box-content #drawer h4::before, #feature_240308 .lp_mainBox #box-content #drawer h4::after {
            position: absolute;
            top: 50%;
            transform: translateY(-50%); }
          #feature_240308 .lp_mainBox #box-content #drawer h4::before {
            content: url("https://carrot.itembox.design/item/images/feature/emergencykit/images/SVG/icon_4.svg");
            width: 32px;
            height: 75px;
            left: 0; }
          #feature_240308 .lp_mainBox #box-content #drawer h4::after {
            content: url("https://carrot.itembox.design/item/images/feature/emergencykit/images/SVG/icon_4.svg");
            transform: translateY(-50%) rotate(180deg);
            width: 32px;
            height: 75px;
            right: 0; }
        #feature_240308 .lp_mainBox #box-content #drawer ul.bag {
          position: relative;
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          margin: 10% auto;
          width: 95%; }
          #feature_240308 .lp_mainBox #box-content #drawer ul.bag::after {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            content: "&";
            font-size: 1.8em;
            color: #13ab67; }
          #feature_240308 .lp_mainBox #box-content #drawer ul.bag li {
            width: calc(100%/2 - 5%); }
            #feature_240308 .lp_mainBox #box-content #drawer ul.bag li p {
              border: 3px solid #13ab67;
              background: #ffffff;
              font-size: 0.9em;
              width: 85%;
              margin: 5% auto;
              letter-spacing: 0.3em; }
              @media screen and (max-width: 500px) {
                #feature_240308 .lp_mainBox #box-content #drawer ul.bag li p {
                  font-size: 3.2vw; } }
        #feature_240308 .lp_mainBox #box-content #drawer .other {
          width: fit-content;
          margin: 10% auto;
          display: flex;
          flex-direction: column; }
          #feature_240308 .lp_mainBox #box-content #drawer .other div {
            margin-bottom: 10%;
            display: flex;
            align-items: center;
            justify-content: flex-start; }
            #feature_240308 .lp_mainBox #box-content #drawer .other div p {
              text-align: left;
              font-size: 0.9em;
              line-height: 1.5; }
              #feature_240308 .lp_mainBox #box-content #drawer .other div p.circle {
                position: relative;
                font-size: 1.2em;
                background: #fff000;
                margin-right: 1.0em;
                height: 50px;
                border-radius: 50%;
                width: 50px; }
                #feature_240308 .lp_mainBox #box-content #drawer .other div p.circle span {
                  position: absolute;
                  top: 50%;
                  left: 50%;
                  transform: translate(-50%, -50%);
                  font-size: 100%;
                  color: #13ab67;
                  font-family: "futura-pt", sans-serif;
                  letter-spacing: 1px; }
              #feature_240308 .lp_mainBox #box-content #drawer .other div p a {
                font-size: 80%;
                color: #e95514;
                letter-spacing: 0;
                text-decoration: underline; }
        #feature_240308 .lp_mainBox #box-content #drawer .animeBox2 {
          position: relative;
          margin: 0 auto;
          text-align: center; }
          @media screen and (max-width: 500px) {
            #feature_240308 .lp_mainBox #box-content #drawer .animeBox2 {
              width: 90%; } }
          #feature_240308 .lp_mainBox #box-content #drawer .animeBox2 .txt {
            line-height: 1.0;
            position: absolute;
            top: 50%;
            right: 17%;
            transform: translateY(-50%);
            color: #e95514;
            font-size: 1.1em;
            letter-spacing: 0;
            margin: 0; }
            @media screen and (max-width: 500px) {
              #feature_240308 .lp_mainBox #box-content #drawer .animeBox2 .txt {
                right: 0; } }
          #feature_240308 .lp_mainBox #box-content #drawer .animeBox2 .anime_3 {
            position: relative;
            transform-origin: left;
            animation: yurayura 2.0s linear infinite; }
        #feature_240308 .lp_mainBox #box-content #drawer .credit {
          width: 80%;
          margin: 25% auto 20%; }
          #feature_240308 .lp_mainBox #box-content #drawer .credit p {
            text-align: left;
            font-size: 0.7em;
            line-height: 1.5;
            margin-bottom: 2.0em; }
            #feature_240308 .lp_mainBox #box-content #drawer .credit p a {
              text-decoration: underline; }
  #feature_240308 #pagetop {
    position: fixed;
    right: 20px;
    z-index: 1005; }
    @media screen and (max-width: 500px) {
      #feature_240308 #pagetop {
        right: 10px; }
        #feature_240308 #pagetop img {
          max-width: 50px;
          border-radius: 50vw;
          box-shadow: 0px 5px 15px 0px rgba(255, 255, 255, 0.35); } }
    #feature_240308 #pagetop a {
      position: relative;
      display: block; }

/* feature_240308 */
@keyframes yurayura {
  0% , 100% {
    transform: rotate(5deg); }
  50% {
    transform: rotate(-5deg); } }
@keyframes loop {
  0% {
    transform: translateX(100%); }
  to {
    transform: translateX(-100%); } }
@keyframes loop2 {
  0% {
    transform: translateX(0); }
  to {
    transform: translateX(-200%); } }
