#l-features-inner .usability .bl-1 .col2 div img@charset "UTF-8";
/* Scss Document */
#l-features-inner .mainimg-inner {
  width: 70%;
  margin: 0px auto; }
#l-features-inner .mainimg{
	position: relative;
}
#l-features-inner .mainimg-inner{
	position: absolute;
	top: 0px;
	left: 5%;
}
#l-features-inner .mainimg-inner .mainimg-inner-text h1{
	margin-bottom: 15px;
}
#l-features-inner .mainimg-inner .mainimg-inner-text{
	width: 100%;
    padding-top: 60px;
}

#l-features-inner .mainimg-inner h2{
	font-weight: bold;
	margin: 20px 0px 10px;
	font-size: 1.4rem;
	width: 38%;
}
#l-features-inner .mainimg-inner .mainimg-inner-text .main_subimg{
	width: 38%;
}
#l-features-inner .mainimg-inner .mainimg-inner-text p{
	width: 38%;
}
#l-features-inner .mainimg-inner .mainimg-inner-text p+p{
	font-size: 1.1rem;
	width: 100%;
	margin-top: 15px;
}
#l-features-inner .mainimg-inner .mainimg-inner-text p+p br{display: none;}
#l-features-inner .usability .hook,#l-features-inner .usability .rock {
  width: 90%;
  margin: 0px auto 130px;
}
#l-features-inner .usability .hook .checkbox{
	margin-bottom: 130px;
}
#l-features-inner .usability .hook .col2{
	margin-bottom: 80px;
}
#l-features-inner .usability .hook .col2 > * {
    width: calc(42% - 30px);
}
#l-features-inner .usability .hook .col2 > *:nth-child(2n) {
    width: calc(58% - 30px);
}
#l-features-inner .usability .hook p.hooksan{
	width: 80%;
	margin: 30px auto 0px;
}
.mainimg-inner-text-sp{display: none;}
#l-features .checkbox h2 {
        margin-bottom: 15px;
    font-size: 2.5rem;
}

#l-features-inner .usability .bl-4 .col2{position: relative;}
#l-features-inner .usability .bl-4 img{
	position: absolute;
    top: -20px;
    right: 20px;
    width: 43%;
	z-index: 2;
}
#l-features-inner .usability .bl-4 .checkbox{z-index: 1;}





@media (min-width: 1280px) {
#l-features-inner .mainimg-inner .mainimg-inner-text h1{
	margin-bottom: 65px;
}
#l-features-inner .mainimg-inner {
  width: 950px; }
}
@media (min-width: 1080px) {
#l-features-inner .mainimg-inner .mainimg-inner-text h1{
	margin-bottom: 45px;
}
#l-features-inner .mainimg-inner {
  width: 950px;
  left: 50%;
  transform: translate(-50%, 0%);
}
#l-features-inner .mainimg-inner .mainimg-inner-text{
	padding-top: 100px;
}
#l-features-inner .mainimg-inner .mainimg-inner-text h1{
	
}
#l-features-inner .mainimg-inner .mainimg-inner-text .main_subimg,#l-features-inner .mainimg-inner .mainimg-inner-text p{
	
}
#l-features-inner .usability .hook,#l-features-inner .usability .rock  {
    width: 950px;
    margin-bottom: 130px; }
	#l-features-inner .mainimg-inner .mainimg-inner-text p+p br{display: block;}
}
 @media (max-width: 900px) {
#l-features-inner .mainimg-inner {
    width: 85%;
	 }
#l-features-inner .mainimg-inner .mainimg-inner-text {
    padding-top: 40px;
}

#l-features-inner .mainimg-inner .mainimg-inner-text p{font-size: 1.2rem;line-height: 1.6;}
#l-features-inner .mainimg-inner .mainimg-inner-text p+p{
	margin-top: 5px;
}
#l-features-inner .usability .hook .checkbox {
    margin-bottom: 90px;
}

}
 @media (max-width: 768px) {
	 #l-features-inner .mainimg-inner .mainimg-inner-text .main_subimg {
    width: 28%;
}
}

 @media (max-width: 640px) {
#l-features-inner .mainimg-inner h2,
	 #l-features-inner .mainimg-inner p{
	display: none;
}
#l-features-inner .mainimg-inner {
    position: absolute;
    top: 0px;
    left: 10%;
    transform: translate(0%, 0%);
}
#l-features-inner .mainimg-inner .mainimg-inner-text .main_subimg {
    width: 38%;
}
#l-features-inner .usability .hook .col2 {
    margin-bottom: 40px;
}
}
 @media (max-width: 480px) {
#l-features-inner .mainimg-inner .mainimg-inner-text .main_subimg{
	display: none;
}
#l-features-inner .mainimg-inner {
    left: 50%;
    transform: translate(-50%, 0%);
}
#l-features-inner .mainimg-inner .mainimg-inner-text h1 {
    width: 100%;
	font-size: 2.4rem !important;
        line-height: 1.5;
}
#l-features-inner .usability .hook .checkbox {
    margin-bottom: 60px;
	border-bottom: solid #000 1px;
}

	 #l-features-inner .usability .rock{
		 margin-bottom: 80px;
		 width: 85%;
	 }	
	 .mainimg-inner-text-sp{
		 width: 85%;
		 margin: 30px auto;
		 display: block;
	 }
	 .mainimg-inner-text-sp .midashi {
    font-weight: bold;
    margin: 20px 0px 10px;
    font-size: 1.6rem;
}
	 .hookimg{
		 text-align: center!important;
		margin: 30px auto;
        width: 85%;
	 }
	 .hookimg img{
		 aspect-ratio: 596 / 2843!important;
	 }
	 #l-features-inner .usability .hook p{
		 width: 85%;margin: 0 auto;
	 }
	 #l-features-inner .usability .hook p.hooksan{display: none;}
	 #l-features-inner .usability .hook .col2 div img{aspect-ratio: 1004 / 1455!important;}
}






#l-features-inner .usability .bl-2 {
  width: 90%;
  margin: 0px auto 100px; }
#l-features-inner .usability .bl-4 {
  width: 90%;
  margin: 0px auto; }
#l-features-inner .usability .bl-5 {
  background: url(../../../image/features/usability/mochite_2023.jpg) no-repeat top right;
  background-size: 50% auto;
  min-height: 500px;
  margin-bottom: 30px;
padding-top: 80px}
  @media (max-width: 768px) {
    #l-features-inner .usability .bl-5 {
      min-height: 350px; } }
  @media (min-width: 1080px) {
    #l-features-inner .usability .bl-5 {
      margin-bottom: 100px; } }
  @media (max-width: 480px) {
    #l-features-inner .usability .bl-5 {
      background: none;
      min-height: auto;
      margin-bottom: 50px;
      border-top: solid 1px #320506;
      border-bottom: solid 1px #320506;
      padding-top: 50px; } }
  #l-features-inner .usability .bl-5 .bl-5-inner {
    width: 90%;
    margin: 0px auto; }
    #l-features-inner .usability .bl-5 .bl-5-inner .mochite-sp {
      display: none; }
    #l-features-inner .usability .bl-5 .bl-5-inner p {
      width: 40%; }
    @media (max-width: 480px) {
      #l-features-inner .usability .bl-5 .bl-5-inner {
        width: 100%; }
        #l-features-inner .usability .bl-5 .bl-5-inner p {
          width: 85%; margin: 0px auto;}
        #l-features-inner .usability .bl-5 .bl-5-inner p.mochite-sp {
          display: block;
          width: 100%;
          line-height: 0; } }
    @media (min-width: 1080px) {
      #l-features-inner .usability .bl-5 .bl-5-inner {
        width: 950px; } }
#l-features-inner .usability .bl-1 {
  width: 90%;
  margin: 0px auto; }
  @media (max-width: 600px) {
    #l-features-inner .usability .bl-1 {
      width: 100%; } }
  #l-features-inner .usability .bl-1 a {
    color: #0000FF; }
  #l-features-inner .usability .bl-1 ul {
    margin: 30px 0px; }
  #l-features-inner .usability .bl-1 .graph-sp {
    display: none; }
  @media (max-width: 600px) {
    #l-features-inner .usability .bl-1 h1 {
      width: 90%;
      margin: 0 auto 30px; }
   
      #l-features-inner .usability .bl-1 .graph-sp p {
        width: 85%;
        margin: 0 auto; }
      #l-features-inner .usability .bl-1 .graph-sp p.midashi {
        background: #dfdadd;
        text-align: center;
        font-weight: bold;
        color: #320506;
        padding: 10px !important;
        font-size: 1.6rem;
        margin: 30px 0;
        width: 100%; }
      #l-features-inner .usability .bl-1 .graph-sp p.fs {
        font-size: 1.1rem; }
      #l-features-inner .usability .bl-1 .graph-sp p.img {
        text-align: center; }
        #l-features-inner .usability .bl-1 .graph-sp p.img img {
          width: 80%;
          margin-bottom: 20px; } }
  @media (max-width: 480px) {
	  #l-features-inner .usability .bl-1 .col2 div img{
		  aspect-ratio: 123 / 188!important;
	  }
	   #l-features-inner .usability .bl-1 p.graph {
      display: none; }
    #l-features-inner .usability .bl-1 .graph-sp {
      display: block; }
    #l-features-inner .usability .bl-1 p {
      padding: 0px !important; } }
#l-features-inner .usability .mainimg-sp {
  display: none; }

#l-features-inner .usability .hook .pt04 {
  margin-bottom: 15px; }
#l-features-inner .usability .bl-4 {
  position: relative;
	margin-bottom: 80px;

}


    #l-features-inner .usability .bl-4 .checkbox h2 {
      padding-right: 45%; }
    #l-features-inner .usability .bl-4 .checkbox p {
      padding-right: 45%; }
      #l-features-inner .usability .bl-4 .checkbox p.note {
        font-size: 1rem;
        color: #320506;
        margin-top: 20px; }
@media (min-width: 1080px) {
  #l-features-inner .usability .bl-1, #l-features-inner .usability .bl-2 {
    width: 950px; }
  #l-features-inner .usability .bl-4 {
    width: 950px; }
  #l-features-inner .usability .bl-4 .checkbox h2 {
    padding-right: 0px; }


}
@media (max-width: 640px) {
 #l-features-inner .usability .bl-4 .checkbox h2,#l-features-inner .usability .bl-4 .checkbox p {
    padding-right: 0;
}
#l-features-inner .usability .hook, #l-features-inner .usability .rock {
    margin: 0px auto 80px;
}

}
@media (max-width: 600px) {
 
  #l-features-inner .usability .bl-4 .checkbox {
    width: 100%; }
    #l-features-inner .usability .bl-4 .checkbox h2 {
      padding-right: 0px; }
    #l-features-inner .usability .bl-4 .checkbox p {
      padding: 0px; }
	#l-features-inner .usability .bl-1 {
        width: 90%;
    }
}
@media (max-width: 480px) {
  #l-features-inner .usability {
    width: 100%; }
    #l-features-inner .usability .mainimg-sp {
      display: block; }
      #l-features-inner .usability .mainimg-sp .main-h1 {
        margin: 0px 0 15px; }
      #l-features-inner .usability .mainimg-sp p {
        width: 85%;
        margin: 0px auto 50px;
        font-size: 1.1rem;
        line-height: 1.6; }
    #l-features-inner .usability h1.main-h1 {
      background: url(../../../image/features/usability/title2_sp.jpg) no-repeat 0 center;
      background-size: cover;
      margin: 0px 0 30px;
      height: 300px;
      position: relative; }
      #l-features-inner .usability h1.main-h1 span.sp-text {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 90%;
        text-align: center;
        line-height: 1.5;
        font-size: 2.8rem;
        margin: 0;
        font-family: "HGS明朝E", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        letter-spacing: .08em;
        font-weight: 300; }
    #l-features-inner .usability .bl-1, #l-features-inner .usability .bl-2, #l-features-inner .usability .hook {
      margin-bottom: 50px;
      width: 100%; }
 
    #l-features-inner .usability .hook {
      border-bottom: solid 1px #320506;
      padding-bottom: 50px; }
      #l-features-inner .usability .hook .pt04 {
        margin-bottom: 50px; }
    #l-features-inner .usability .bl-4 {
      width: 100%; border-top: solid 1px #320506;padding-top: 70px;margin-bottom: 20px;}

     
      #l-features-inner .usability .bl-4 .checkbox {
        border-bottom: none;margin-top: 20px; } }
#l-features-inner .usability .box-border {
  border: solid 1px #320506;
  margin-top: 80px; }


  #l-features-inner .usability .box-border h2 {
    background: #320506;
    color: #FFF;
    text-align: center;
    padding: 7px 0 5px;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "游ゴシック Medium", YuGothic, "メイリオ", "Meiryo", sans-serif;
    letter-spacing: .08em;
    font-size: 1.4rem; }
  #l-features-inner .usability .box-border p {
    padding: 30px; }
    #l-features-inner .usability .box-border p a {
      text-decoration: underline;
      color: #EE87B4; }
    @media (max-width: 480px) {
      #l-features-inner .usability .box-border p {
        padding: 15px 25px 40px; } }
@media (max-width: 480px) {
  #l-features-inner .usability .spimg {
    line-height: 0;
    margin-top: 40px !important; }

	#l-features-inner .mainimg img{
		aspect-ratio: 250 / 537!important;
	}
	#l-features-inner .mainimg .mainimg-inner-text img{
		aspect-ratio: 300 / 121!important;
	}
	#l-features h2.tc{text-align: center;margin-bottom: 20px;}
	.hook .col2 div{
		width: 85%;
		margin: 0px auto;
	}
	.hook .col2 div+div{
		width: 100%;
		margin: 30px auto;
	}
	.col2 div {
        width: 100%;
		margin-right: 0;
    }
	#l-features-inner .usability .hook .col2 {
    margin: 20px auto 0px;
}
	#l-features-inner .usability .hook .col2 > * {
    width: 100% !important;
}
	#l-features-inner .usability .bl-4 img{
		position: static;
		width: 100%;
        aspect-ratio: 750 / 1049!important;
	}
	
	#l-features .policy-navi section.capacity {
    background: url(../../../image/features/2025/capacity_sp.webp) no-repeat center top!important;
    background-size: 100% auto!important;
	min-height: 460px!important;
}
}

/*# sourceMappingURL=usability.css.map */