.wrap {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
}

.h2_title {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding-top: 70px;
}

.h2_title h2{
  font-size: 43px;
  color: #000000;
  font-weight: bold;
  letter-spacing: -0.3pt;
  line-height: 1.38;
  margin: 0;
}


.service_notice{
  padding: 20px 0 15px 0;
  text-align: center;
}

.service_notice h3 {
  font-size: 26px;
  color: #1f6fc2;
  line-height: 19px;
  margin: 0px;
  font-weight: bold;
}


.service_tab_plan {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}



input[name="tab_item"] {
    display: none;
}

input[type="radio" i] {
    background-color: initial;
    cursor: default;
    appearance: auto;
    box-sizing: border-box;
    margin: 3px 3px 0px 5px;
    padding: initial;
    border: initial;
}

.tab_item {
    width: 100%;
    font-size: 18px;
    text-align: center;
    color: #FFFFFF;
    display: block;
    float: left;
    cursor: pointer;
    background-color: #A0AAAE;
    padding: 18px 0px 14px 0px;
    border-right: 1px solid #B8BEC1;
}


 .tab_item_right {
    width: 365px;
    font-size: 18px;
    text-align: center;
    color: #FFFFFF;
    display: none;
    float: left;
    cursor: pointer;
    background-color: #A0AAAE;
    padding: 18px 0px 14px 0px;
    border-right: 0px solid #B8BEC1;
}


#fileshare_plan:checked ~ .fileshare_plan,
#filesever_plan:checked ~ .filesever_plan,
#all_plan:checked ~ .all_plan {
    background-color: #0061D5;
    color: #fff;
}


.tab_item:hover {
    background-color: #0061D5;
    color: #fff;
}


/*選択されているタブのスタイルを変える */
.tabs input:checked + .tab_item {
  background-color: #e3e5ee;
  color: #555;
  border-radius: 10px 10px 0 0;
  border-bottom: 1px solid #e3e5ee;
  position: relative;
  top: 1px;
}



.fixed_menu {
  position: fixed;
  top: 0;
  z-index: 90;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#fileshare_plan:checked ~ #fileshare_content,
#filesever_plan:checked ~ #fileserver_content,
#all_plan:checked ~ #all_plan_content {
  display: block;
}


.link-service-url-2 {
  width:100%;
  text-align: right;
  padding: 6px 4px 8px 0px;
}

.link-service-url-3 {
  width: 100%;
  text-align: right;
  padding: 20px 4px 30px 0px;
}


a.servicetab_url_link {
    font-size: 18px;
    color: #0054a6;
    font-weight: normal;
    line-height: 27px;
    text-decoration: none;
}


/* ========================================
■ section  プラン、料金 start　▼
======================================== */



a.btn_link_a2 {
    font-size: 17px;
    color: #ffffff !important;
    text-align: center;
    text-decoration: none;
    display: block;
    line-height: 2.75;
}



.fixed_menu {
  position: fixed;
  top: 80px;
  z-index: 90;
  width:1400px;
}


.plan_serve_name {
  font-size: 17px;
  margin: 0;
  line-height: 18px;
  color: #c0c0c0;
  padding: 0;
}


.lh21 {
    line-height: 1.4;
    display: inline-block;
    padding-bottom: 10px;
}



.all_btn_size {
  width: 165px;
  margin-top: 3px;
}


.btn_link_apply_red {
  height: 37px;
  font-size: 13px;
  color: #ffffff;
  text-align: center;
  background: #FF114A;
  line-height: 38px;
  border-radius: 4px;
  letter-spacing: -0.2pt;
}

.btn_link_apply_red:hover {
  background: #FF114A;
  box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.2);
  cursor:pointer;transform:scale(1.02,1.02);transition:transform .2s;
}

.chk_icon {
    width: 17px;
    padding-bottom: 2px;
    vertical-align: text-bottom;
}

img.cross_icon {
    width: 14px;
    padding-bottom: 4px;
}


.comm_align {
    margin:11px 0 0;
    padding: 0;
}

.comm_align li {
  text-indent: -25px;
  margin-left: 25px;
  line-height: 20px;
  padding-bottom: 4px;
  list-style: none;
  font-size: 14px;
}



  .btn_detailse {
    cursor: pointer;
    margin: 0 auto;
    border-radius: 47px;
    color: #0058D3;
    font-size: 17px;
    text-align: center;
}



.purpose_title {
    margin-top: 5px;
    font-size: 18px;
}


.service_title_txt {
    color: #202124 !important;
    font-weight: bold;
    text-decoration: none;
    font-size: 23px;
    letter-spacing: -0.5px;
}

.cost_num {
    font-size: 26px;
    font-weight: bold;
}


.cost_num_all {
    font-weight: bold;
    font-size: 21px;
}



.service_all_h4_area h4{
  text-align:center;
  font-weight: bold;
  font-size: 19px;
  line-height: 1.8;
  border-bottom: 1px solid #d1d7d9;
  padding: 12px 5px 14px;
  height: 76px;
}

.service_all_h4_area h4 span{
  display: block;
  font-size: 15px;
  color: #7a7a7a;
  line-height: 1;
  font-weight: 100;
  letter-spacing: -0.3px;
}


.purpose_title_all {
  margin-top: 5px;
    font-size: 15px;
    line-height: 20px;
    height: 127px;
    padding: 11px 11px 16px 11px;
    color: #616161;
}



.tabs {
  margin-top: 50px;
  background-color: #fff;
  width: 1080px;
  margin: 0 auto;
}




.red_point {
    padding-left: 4px;
    line-height: 22px;
    font-size: 10px;
    color: red;
}



.icon_span_text {
  font-size: 15px;
  color: #818181;
  display: block;
  line-height: 1.4;
  padding-top: 0px;
  letter-spacing: -0.3pt;
}





/*   2025/02/04  新料金プラン　start  */


.small_main_plan,
.enterprise_main_plan {
    color: #444444;
    display: flex;
    margin-bottom: 30px;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
    background-color: #ffffff;
}


.small_main_plan dl{
  width: 25%;
  padding: 20px;
  border: 1px solid #cbcccf;
}


.enterprise_main_plan dl{
  padding: 20px;
  border: 1px solid #cbcccf;
  flex:1;
}



.plan_title_dt {
  text-align: center;
  margin-bottom: 15px;
  border-bottom: 1px solid #e5e5e5;
  padding: 15px 0 35px 0;
}


.plan_title_dt .plan_serve_name {
    font-size: 20px;
    margin: 0;
    line-height: 18px;
    color: #c0c0c0;
    padding: 0;
}


.plan_title_dt .service_title_txt {
  color: #202124 !important;
  font-weight: bold;
  text-decoration: none;
  font-size: 29px;
  letter-spacing: -0.5px;
}


.plan_title_dt .cost_num_all {
    font-weight: bold;
    font-size: 32px;
    color: #000000;
}



.plan_title_dt .cost_comm {
    font-size: 20px;
    color: #000000;
}



.plan_title_dt .all_btn_size {
    width: 155px;
    margin-top: 3px;
}

.plan_title_dt .btn_link_apply_red {
    width: 70%;
    height: 50px;
    margin-top: 3px !important;
}

.plan_title_dt a.btn_link_a2 {
    font-size: 18px !important;
    font-weight: bold;
}




.enterprise_main_plan .plan_title_dt .btn_link_apply_red{
  width: 70%;
  height: 54px;
}


.enterprise_main_plan .plan_title_dt .plan_serve_name{
  font-size: 22px;
}


.enterprise_main_plan .plan_title_dt .service_title_txt{
  font-size: 31px;
}

.enterprise_main_plan .plan_title_dt a.btn_link_a2 {
    font-size: 20px !important;
    line-height: 2.6;
}


.enterprise_main_plan .plan_title_dt .cost_num_all {
    font-size: 34px;
}

.enterprise_main_plan .plan_title_dt .cost_comm {
    font-size: 22px;
}


.plan_contents_dd{
  font-size:18px;
  padding: 0 20px;
}



.btn_link_apply_red.all_btn_size {
    margin: 4px auto;
    border-radius: 50px;
}


.small_main_plan dl {
    width: 25%;
    padding: 20px;
    border: 1px solid #cbcccf;
}


.standard_dl,
.advanced_dl,
.business_dl{
  border-right: none !important;
  position: relative;
 }


 .business_dl {
   position: relative;
   background-color: #ebf6ff;
 }


 .enterprise50_dl {
     border-right: none !important;
     border-left: none !important;
     position: relative;
 }

 .enterprise100_dl{
   position: relative;
 }


 .recommend_plan {
   position: absolute;
   width: 100%;
   height: 104.5%;
   border: 3px solid #2486fc;
   left: 0;
   top: -50px;
   border-radius: 10px 10px 0 0;
 }


 .recommend_plan div {
   background: #2486fc;
   padding: 5px;
   color: #fff;
   text-align: center;
   font-size: 23px;
   font-weight: bold;
 }



 .new_plan_icon {
   position: absolute;
   width: 30%;
   left: 35%;
   top: -22px;
   border-radius: 30px;
   background: linear-gradient(90deg, #7208ca 0%, #f6177a 100%);
   padding: 3px;
   color: #fff;
   text-align: center;
   font-size: 22px;
   font-weight: bold;
  font-family: 'Noto Sans JP', sans-serif;
 }





.purpose_area_item {
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: bold;
    position: relative;
}


.purpose_area_title{
  font-weight: bold;
}



.purpose_area_main {
    margin-bottom: 35px;
}


.purpose_area_title::before {
    content: "";
    display: inline-block;
    background-image: url(/images/contents/green_check.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 14px;
    height: 17px;
    background-position-y: 5px;
    margin-right:8px;
}



.purpose_area_item::before {
    content: "";
    display: inline-block;
    background-image: url(/images/contents/green_check.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 12px;
    height: 17px;
    background-position-y: 7px;
    margin-right:10px;
}


.purpose_area_item.not_support::before {
  display: inline-block;
  background-image: url(/images/contents/gray_check.svg);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 12px;
  height: 17px;
  background-position-y: 7px;
  margin-right:10px;
}


.purpose_area_item .help_popup {
    width:18px;
    height:18px;
    position: absolute;
    top: 3px;
}


.purpose_area_item .help_popup_warm {
    width:18px;
    height:18px;
    position: absolute;
    top: 3px;
}



li.paid_option_title.r_option_busubess_bg{
  background-color: #ddedfb;
}


li.paid_option_title.r_option_advanced_bg{
  background-color: #FAFAFC;
}


.ques_5gb{right: 44px;}
.ques_10gb{right: 35px;}
.ques_15gb{right: 35px;}
.ques_20gb{right: 34px;}
.ques_30gb{right: 140px;}
.ques_4tb{right: 9px;}
.ques_12tb{right: 7px;}
.ques_35tb{right: -2px;}
.ques_50tb{right: 3px;}
.ques_100tb{right: -6px;}



.purpose_area_title span {
  display: block;
  font-size: 16px;
  padding-left: 12px;
  margin-top: -4px;
  color: #8f8f8f;
  font-weight: 100;
}


.purpose_explan {
  font-size: 16px;
  line-height: 1.4;
  height: 65px;
  color: #8f8f8f;
  margin-top: 7px;
}


.not_support{
color:#cacaca;
font-weight: 100;
}


.span_parentheses {
  font-size: 13px;
  font-weight: 100;
  color: #747474;
}


.not_support .span_parentheses{
  color:#d9d9d9;
}

.storage_capacity{
  color: #FF114A;
}


.slider_plan li{
  padding-top: 20px;
}

.scroll-hint-icon {
    top: calc(18% - 25px) !important;
}




.purpose_li_storage {
    display: flex;
    flex-direction: column;
}



.purpose_li_storage {
    display: flex;
    flex-direction: column;
}


.li_storage_title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    position: relative;
}



li.paid_option_title {
    font-weight: 700;
    margin-bottom: 5px;
    margin-top: 25px;
    font-size: 18px;
    border-bottom: 1px dotted #e3e7ea;
    padding: 4px 0px 4px 0px;
    line-height: 31px;
}


li.paid_option_title::before {
    content: "";
    display: inline-block;
    background-image: url(/images/contents/price_option1.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 6px;
    vertical-align: -14%;
}


.purpose_area_item .help_popup_plan {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 4px;
}


.ques_80space {
    right: 80px;
}



.purpose_area_item .help_popup_enterplus {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 4px;
}


.ques_195space {
    right: 195px;
}


/*  switch　css start */

.switch-button {
  width: 50%;
  height: 68px;
  text-align: center;
  left: 50%;
  top: 50%;
  will-change: transform;
  z-index: 197 !important;
  cursor: pointer;
  transition: 0.3s ease all;
  border: 1px solid white;
  margin: 50px auto 30px;
  background-color: #E9EEF6;
  border-radius: 50px;
  padding: 16px 0px;
}



.switch-button-case {
  display: inline-block;
  background: none;
  width: 49%;
  height: 100%;
  color: #a5a9b1;
  position: relative;
  border: none;
  transition: 0.3s ease all;
  text-transform: uppercase;
  padding-bottom: 1px;
  font-size: 22px;
  font-weight: 700;
}
.switch-button-case:hover {
  color: grey;
  cursor: pointer;
}
.switch-button-case:focus {
  outline: none;
}

.switch-button .active {
      color: #ffffff;
      background-color: #0061D5;
      position: absolute;
      left: 0;
      top: 0;
      width: 50%;
      height: 100%;
      z-index: -1;
      transition: 0.3s ease-out all;
      border-radius: 50px;
      font-weight: bold;
}


.switch-button .active-case {
  color: #ffffff;
  font-weight: bold;
}

.signature {
  position: fixed;
  font-family: sans-serif;
  font-weight: 100;
  bottom: 10px;
  left: 0;
  letter-spacing: 4px;
  font-size: 10px;
  width: 100vw;
  text-align: center;
  color: white;
  text-transform: uppercase;
  text-decoration: none;
}










.new_service_area{
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	width:100%;
}


.flex_fix_tit_dt{
	border-bottom: 1px solid #d8dee3;
	border-right: 1px solid #d8dee3;
	background-color: #FAFAFC;
	color: #262626;
	padding: 17px 14px;
	font-size: 17px;
	line-height: 22px;
	height:195px;
}

.flex_r_tit_dt{
	border-bottom: 1px solid #d8dee3;
	border-right: 1px solid #d8dee3;
	background-color: #FAFAFC;
	color: #262626;
	padding: 32px 14px 17px 14px;
	font-size: 17px;
	line-height: 22px;
	height:195px;
	text-align: center;
  position: relative;
}


.rowspan_title {
  border-bottom: 1px solid #d8dee3;
	border-right: 1px solid #d8dee3;
  background-color: #FAFAFC;
  color: #262626;
  padding: 20px 15px;
  font-size: 17px;
  line-height: 22px;
	height:64px;
}


.dl_right_dd{
		font-size: 16px;
	  line-height: 20px;
	  height: 64px;
	  padding: 0;
	  color: #444444;
	  text-align: center;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	  border: 1px solid #d8dee3;
	  border-top: none;
	  border-left: none;
    background-color: #ffffff;
}

.dl_right_dt{
	height: 64px;
	border-bottom: 1px solid #d8dee3;
}


.title_2line_height{
	height:84px;
}


.scroll_table_ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}


.js-scrollable li dl {
	  width:226px;
    border-top: 1px solid #d8dee3;
    /* border-bottom: none; */
    /* border-right: none; */
}



.dl_table1,.dl_table2,.dl_table3,.dl_table4,
.dl_table5,.dl_table6,.dl_table7{
	width:20%;
}


.service_all_h4_area {
    width: 100%;
		/* border-bottom: 1px solid #f2f2f2; */
}


.title_fix_dt {
    border-right: none;
}


.flex_align_center{
	display: flex;
	align-items: center;
}


.icon_span_text{
	padding: 2px 5px
}


.purpose_title_all{
	padding: 0 15px 16px 15px;
	text-align: left;
}



.cross_icon{
	  width: 14px;
    padding-bottom: 0px;
}

.chk_icon {
    padding-bottom: 0px;
}

.best_green_all {
    position: absolute;
    left: -14px;
    top: -32px;
}

.blue_area {
    background: #E8F2FE !important;
}


.btn_link_apply_red.all_btn_size{
	margin: 4px auto;
}



p.purpose_title_all {
    white-space: normal;
}





.flex_left{
	width:18%;
	min-width:270px;
  padding-top: 30px;
}


.flex_right{
	width:80%;
	min-width:1130px;
}


.detailse_new_plan_icon{
  position: absolute;
  width: 37%;
  left: 33%;
  top: -15px;
  border-radius: 30px;
  background: linear-gradient(90deg, #7208ca 0%, #f6177a 100%);
  padding: 3px 3px 4px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
}

.h2_title {
    width: 100%;
    margin: 0 auto;
    text-align: center;


    padding-bottom: 8px;
    display: none;
}


/*  slide　css start  */
#container_box {
  position: relative;
  width: 100%;
  height: 1242px;
  overflow: hidden;
  clear: both;
  font-family: 'Noto Sans JP', sans-serif;
}



.main_tab_box {
    display: inline-block;
    position: absolute;
    width: 100%;
    padding-top: 50px;
    height: 1185px;
}


#first {
    top: 0px;
    left: 0px;

}

#second {
    top: 0px;
    left: 1400px;
}


#slide {
    transition: transform 0.0s ease-in-out 0s;
    -moz-transition: -moz-transform 0.0 ease-in-out 0s;
    -webkit-transition: -webkit-transform 0.0 ease-in-out 0s;

}


.move-to-first {
    transform: translateX(0px);
    -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    animation: fadeOut 1.5s ease 0s 1 normal backwards;
}
@keyframes fadeOut {
  from {
    opacity: 0.5;
    transform: translateX(-1400px);
  }
  to {
    opacity: 1;
    transform: translateX(0px);
  }
}


.move-to-second {
    transform: translateX(-1400px);
    -moz-transform: translateX(-1400px);
    -webkit-transform: translateX(-1400px);
    animation: fadeIn 1.5s ease 0s 1 normal backwards;
}

@keyframes fadeIn {
  from {
    opacity: 0.5;
    transform: translateX(0);
  }
  to {
    opacity: 1;
    transform: translateX(-1400px);
  }
}


.move-to-first .tab_box_second{
  animation: fade2 1.5s ease 0s 1 normal backwards;
}
@keyframes fade2 {
  from {
    opacity: 0.5;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(0);
  }
}


.move-to-second .tab_box_first {
  animation: fade3 1.5s ease 0s 1 normal backwards;
}

@keyframes fade3 {
  from {
    opacity: 0.5;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(0);
  }
}


.move-to-first .tab_box_first {
  animation: fade4 1.5s ease 0s 1 normal backwards;
}
@keyframes fade4{
  from {
    opacity: 0.5;
    transform: translateX(0);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}


.move-to-second .tab_box_second {
  animation: fade5 1.5s ease 0s 1 normal backwards;
}

@keyframes fade5 {
  from {
    opacity: 0.5;
    transform: translateX(0);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}


.selected .main_tab_box{
  opacity: 1;
}

.purpose_area_title {
    font-weight: bold;
    height: 47px;
}


/*  切り替えタブ　css end  */

/*   2025/02/04  新料金プラン　end  */



/* ========================================
■ section  プラン end　▲
======================================== */


#fileshare_plan:checked ~ #fileshare_content, #filesever_plan:checked ~ #fileserver_content, #all_plan:checked ~ #all_plan_content {
    display: block;
}


.td_title_bracket{
  color: #8d8d8d;
  font-size: 15px;
  display: block;
  margin-left: -8px;
  line-height: 25px;
}



.details_area {
    text-align: right;
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.more-button-block {
    text-align: center;
    margin: 0px 0px 20px;
}

.standard-button {
    font-family: 'Noto Sans JP', sans-serif;
    display: inline-block;
    width: 345px;
    height: 68px;
    border-radius: 60px;
    padding: 0 40px;
    background-color: #fff;
    border: 2px solid #dad8d8;
    text-decoration: none;
    color: inherit;
    font-weight: 700;
    position: relative;
    font-size: 22px;
    /* color: #4c4c4c; */
}

.standard-button a {
    display: -ms-flexbox;
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    line-height: 1;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #4c4c4c;
    text-decoration: none;
}

.more-button-block.standard-button:hover a {
  color: #ffffff;
  opacity: 1;
}


.standard-button:hover, .standard-button:active, .standard-button:focus {
    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    transform: scale(1.04, 1.04);
    transition: transform .2s;
    text-decoration: none;
    background-color: #378ee4;
    border: 2px solid #378ee4;
    color: #fff;
}


p.sp_plan_title {
    font-size: 18px;
}



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


.wrap{
  padding: 20px;
}

.h2_title{
  padding-top:0;
}

.h2_title h2{
  font-size: 35px;
}


.link-service-url-2{
  text-align: right;
  width:100%;
  padding: 6px 0px 7px 0px;
}

.link-service-url-3 {
  width: 100%;
  text-align: right;
  padding: 30px 0px 30px 0px;
}


a.servicetab_url_link {
    font-size: 15px;
  }



.func_table_area {
    width: 100%;
    text-align: center;
    background-color: #fff;
    position: relative;
    font-size: 14px;
    color: #202124;
}


.func_table_area {
    border-collapse: collapse;
    border-spacing: 0;
}

.func_table_area td {
    vertical-align: middle;
    border: 1px solid #d8dee3;
    padding:16px 10px;
    line-height: 1.3;
}

.icon_span_text {
  padding: 2px 0px !important;
}


.service_all_h4_area h4 {
    font-size: 17px;
    line-height: 1.45;
    padding: 14px 5px 14px;
}


.service_all_h4_area h4 span {
    display: block;
    font-size: 13px;
    color: #7a7a7a;
    line-height: 1.4;
    font-weight: 100;
    letter-spacing: -0.3px;
}

/* アコディアン */

.details_blue_box {
    border: 1px solid #d6d6d6;
}



.summary_blue{
    background-color: #f0f0f0;
}


.details-summary {
  position: relative;
  display: block;
  padding: 15px;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
  line-height: 1.4;
  color: #202124;
  background-color: #edeff6;
	&:hover {
		cursor: pointer;
	}

	.btn {
		position: absolute;
        top: 39%;
        right: 5%;
        width: 18px;
        height: 18px;
        transform-origin: center center;
        transition-duration: 0.2s;

        &:before,
        &:after {
            content: "";
            background-color: #202124;
            border-radius: 10px;
            width: 16px;
            height: 2px;
            position: absolute;
            top: 7px;
            left: 0;
            transform-origin: center center;
        }
        &:before {
            width: 2px;
            height: 16px;
            top: 0;
            left: 7px;
        }
    }


	&.is-active {
		.btn {
			-webkit-transform: rotate(-180deg);
			transform: rotate(-180deg);
			&:before {
            	content: none;
        	}
		}
    }
}



.btn_orange::before,
.btn_orange::after{
 background-color: #e30500 !important;
}

.details-summary::-webkit-details-marker {
	display: none;
}

.details-content {
	padding: 0px;
}

.close-btn {
	display: block;
	margin: 10px auto 30px;
	padding: 8px 32px;
  background: #a7b4c2;
  color: #ffffff;
	text-align: center;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}


.close-btn p {
		margin: 0 0 20px;
		color: #000;
		font-size: 18px;
		text-align: left;
  }


.close-btn p:last-of-type {
	margin: 0 0 40px;
}


.details-content {
	padding: 0px;
	.close-btn {
		display: block;
		margin: 7px auto 30px;
		padding: 8px 32px;
		background: #00a5a0;
		color: #0061D5;
		text-align: center;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		&:hover {
			opacity: 0.8;
		}
	}

	}


.details-content
.close-btn {
    display: block;
	  margin: 10px auto 30px;
    padding: 12px 70px 10px;
    background: #a7b4c2;
    color: #ffffff;
    text-align: center;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 15px;
}


/* 以下の記述は不要です */




.sp_table_left{
  width: 50%;
  background: #fafafc;
  text-align: left;
  border-left:none !important;
  border-right:none !important;
}

.sp_table_right{
  width: 50%;
  border-right:none !important;
}


.comm_align {
    margin: 0;
    padding: 15px;
}

.comm_align li {
  text-indent: -25px;
  margin-left: 24px;
  line-height: 1.4;
  padding-bottom: 8px;
  list-style: none;
  font-size: 12px;
  color: #666666;
}


.sp_plan_title{
  margin:0;
　color: #202124 !important;
  position: relative;
  font-family: 'Noto Sans JP', sans-serif;
}


.service_title_txt {
    color: #202124 !important;
    font-weight: bold;
    text-decoration: none;
    font-size: 17px;
    margin:0;
}

.plan_serve_name {
    font-size: 13.5px;
    margin: 3px 0 3px;
    line-height: 13px;
    color: #c0c0c0;
    padding: 0;
}

.cost_num_all {
    font-weight: bold;
    font-size: 19px;
}

.cost_comm {
    font-size: 14px;
    padding-left: 0px;
    color: inherit;
    text-shadow: 0px 0px 10px #bbbaba !important;
}

.all_btn_size {
    width: 100%;
    margin-top: 5px;
}

.btn_link_apply_red {
    height: 35px !important;
    font-size: 13px !important;
    color: #ffffff !important;
    text-align: center !important;
    background: #FF114A !important;
    line-height: 38px !important;
    border-radius: 30px !important;
    letter-spacing: -0.2pt !important;
}


.btn_link_apply_red:hover {
    background: #FF114A;
    box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transform: scale(1.02,1.02);
    transition: transform .2s;
}


a.btn_link_a2 {
  font-size: 13px;
  color: #ffffff !important;
  text-align: center;
  text-decoration: none;
  display: block;
  line-height: 2.7;
}

.sp_price{
  margin-top:5px;
}

.purpose_title_all {
  margin-top: 0px;
  font-size: 14px;
  line-height: 18px;
  text-align: left;
  height: auto;
  padding: 18px 15px 10px 15px;
}


.sp_table_oneline{
  background-color: #F4F5F6;
  color: #262626;
  padding: 17px 14px;
  font-size: 15px;
  text-align: left;
  border-left:none !important;
  border-right:none !important;
}

.chk_icon {
  width: 16px;
  padding-bottom: 0px;
}

.cross_icon {
    width: 12px;
    padding-bottom: 0px;
}



.td_title_bracket{
    font-size: 11px;
    line-height: 18px;
    margin-left:0;
}

.table_bg_color{
  background-color: #EBEDEF;
}


.icon_span_text {
    font-size: 12px;
    color: #818181;
    display: block;
    line-height: 1.4;
    padding-top: 3px;
}


.red_point {
  padding-left: 3px;
  line-height: 22px;
  font-size: 0.7em;
  color: red;
  vertical-align: text-top;
}

.vab {
    vertical-align: sub !important;
}

.sp_left20{
  padding-left:20px;
}

.Advanced_plan,
.business_plan,
.premium_plan,
.enterprise_plan{
  margin-top:6px;
}



.Advanced_plan.recommend_plan {
    background-color: #E8F2FE;
}

.business_plan.recommend_plan {
    background-color: #E8F2FE;
}






.recommend_plan {
    position: inherit;
    width: 100%;
    height: auto;
    border: none;
    left: 0;
    top: 0;
    border-radius:0;
}

.recommend_plan div {
    background: inherit;
    padding: 0;
    color:inherit;
    text-align: center;
    font-size: 23px;
    font-weight: bold;
}





.recommend_icon_area{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  position: relative;
}

.recommend_icon {
  font-size: 12px;
  position: absolute;
    left: 131px;
    color: #fff;
    background: #0576e5;
    background: linear-gradient(90deg, #2486FC 0%, #0058f9 100%);
    padding: 4px 10px;
    box-sizing: border-box;
    border-radius: 33px;
    top: 16px;
    font-family: 'Noto Sans JP', sans-serif;
}


.new_icon_area{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  position: relative;
}

.new_icon {
  font-size: 12px;
  position: absolute;
  left: 56%;
  color: #fff;
  background: linear-gradient(90deg, #7208ca 0%, #f6177a 100%);
  padding: 4px 18px;
  box-sizing: border-box;
  border-radius: 33px;
  top: 3px;
}


.tab_content_description {
    margin-bottom: 20px;
}

.lh21{
      padding-bottom: 6px;
      line-height: 1.4;
}



.enter_new_icon50 {
  left: 52%;
  top: 5%;
}

.enter_new_icon100 {
  left: 55.5%;
  top: 1%;
}



}
