@charset "utf-8";

@media screen and (max-width: 1000px) {
  body {
    font-size: 1.4rem;
  }
  .nopc {
    display: block;
  }
  .nosp {
    display: none;
  }
  .content_wrap {
    padding: 30px 0;
  }
  .content_box {
    width: 95%;
  }
  #header_wrap {
    margin: 0 auto 35px;
    width: 95%;
  }
  #gloval_menu {
    width: 100%;
  }
  .ryokin dl {
    width: 50%;
  }
  .ryokin dl:nth-of-type(1), .ryokin dl:nth-of-type(2) {
    border-bottom: 1px solid #999;
  }
  .ryokin dl::before {
    height: 110%;
    top: -5%;
  }
  .ryokin dl:nth-of-type(3)::before {
    width: 0;
  }
  .mds02 {
    font-size: 2.2rem;
    letter-spacing: 0.1;
  }
  #service li {
    margin-bottom: 20px;
  }
  #service li.half {
    width: 100%;
  }
  
  #contact .content_box {
    width: 90%;
  }
  #footer_wrap footer {
    width: 100%;
  }
  #footer_wrap .credit {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .toggle_btn {
    display: block;
  }
  #header .btn_area {
    right: 70px;
  }
  #gloval_menu, #fnav_menu {
    display: none;
  }
  #shipping_fee .jirei h2 img {
    width: 40%;
  }
  #postage .soryo_title {
    width: 40%;
  }
}

@media screen and (max-width: 640px) {
  .mds01 {
    margin: 20px 0 30px 0;
    text-align: center;
  }
  .mds01 span {
    display: block;
    margin: 10px 0 0 0;
    font-size: 24px;
  }
  #shipping_fee .flex_center {
    flex-direction: column-reverse;
  }
  #shipping_fee .juryo p {
    width: 100%;
  }
  #shipping_fee .juryo p:nth-child(2) {
    margin-bottom: 10px;
  }
  #shipping_fee .jirei li {
    width: calc((100% - 20px) / 2);
  }
  #lead .site_lead {
    height: auto;
  }
  #lead .site_lead.left {
    flex-direction: column-reverse;
  }
  #lead .site_lead.right {
    flex-direction: column;
  }
  #lead .site_lead .pict {
    width: 80%;
    height: auto;
  }
  #lead .site_lead.left .pict {
    
  }
  #lead .site_lead.left .pict img {
    object-fit: cover;
    object-position: left top;
    width: 100%;
    height: auto;
  }
  #lead .site_lead .text {
    width: 80%;
  }
  #lead .site_lead .text_box {
    width: 98%;
  }
  #lead .site_lead.left .text_box,
  #lead .site_lead.right .text_box {
    justify-content: center;
  }
  #campain::before {
    top: -40%;
  }
  #campain::after {
    top: -40%;
  }
  #campain h1 {
    width: 95%;
  }
  #sagyo .pict {
    width: 95%;
  }
  #service h1::before {
    display: none;
  }
  #service .mds02 {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  
  .contact_form  {
     flex-direction: column;
  }
  .contact_form dt, .contact_form dd {
    width: 100%;
  }
  .contact_form dt {
    justify-content: center;
    padding: 15px 10px 0;
    border-bottom: 0;
  }
  #postage .annotation {
    text-align: left;
  }
}

@media screen and (max-width: 480px) {
  .button_link {
    width: 90%;
  }
  .ryokin {
    font-size: 1.2rem;
  }
  .visual_lead.pc, .visual_wrap.pc, #lead h1.pc, #lead .site_lead.right .text img.pc {
    display: none;
  }
  .visual_lead.sp, .visual_wrap.sp, #lead h1.sp, #lead .site_lead.right .text img.sp {
    display: block;
  }
  .visual_lead.sp {
    margin: 0 auto;
  }
  #lead h1.sp {
    margin: 0 auto 30px;
  }
  
  #flow .flow_box {
    flex-direction: column;
  }
  #flow .flow_box:nth-of-type(3) {
    flex-direction: column-reverse;
  }
  #flow .flow_box p {
    width: 100%;
  }
}